VS Code插件开发学习笔记2-开发一个Vivado Report文件高亮的插件

1 前言

在VS Code插件开发学习笔记1中，根据官网的教程，我已经精通VS Code插件编写了（😃 完成了hello world）。所以回归最初的目的：写一个可以完成Vivado report文件（.rpt）的高亮功能的插件。

2 新建工程

按照之前的方式创建一个“New Language Support”类型的模板工程。

• Language Id ：语言的唯一标识符。
• Language Name：一个可读的名称。
• Scope names：作用域名称，也就是文件的格式。

生成器假定要为该语言定义新语言和新语法。如果正在为现有语言创建语法，只需使用目标语言的信息填写这些信息，并删除languages生成的package.json。

创建好的工程的文件结构：

打开文件“package.json”：

• 可以看到，这个工程包含一个名为“grammars”的组件（Contribution Points，贡献点？）。
• 代码中的grammars字段的作用是为一门语言贡献一个TextMate grammars。
• TextMate是一个可定制的文本编辑器，支持大量的编程语言，并作为开源开发。他用的就是grammars语言。VS Code 也使用TextMate grammars作为语法标记引擎。
• grammars语言用于为文档元素(如关键字、注释、字符串或类似元素)分配名称。这样做的目的是允许样式化(语法高亮显示)，并使文本编辑器“智能”显示插入符号所在的上下文。

系统自动添加了grammars，所以主要关注文件"rpt.tmLanguage.json"就行：

{
	"$schema": "https://raw.githubusercontent.com/martinring/tmlanguage/master/tmlanguage.json",
	"name": "rpt",
	"patterns": [
		{
			"include": "#keywords"
		},
		{
			"include": "#strings"
		}
	],
	"repository": {
		"keywords": {
			"patterns": [{
				"name": "keyword.control.rpt",
				"match": "\\b(if|while|for|return)\\b"
			}]
		},
		"strings": {
			"name": "string.quoted.double.rpt",
			"begin": "\"",
			"end": "\"",
			"patterns": [
				{
					"name": "constant.character.escape.rpt",
					"match": "\\\\."
				}
			]
		}
	},
	"scopeName": "source.rpt"
}

rpt.tmLanguage.json文件本身包含一个规则。通常分为patterns字段：列出程序的元素{ “include”: “#id” }；repository字段：定义每个元素的具体内容。语法中的其他规则可以从repository引用元素。

到这里就比较清楚了，例子首先在patterns分别新建一种ID为keywords和strings的元素，然后在repository说明每种元素的正则规则，这对应了与代码中哪些字符串匹配。

3 功能实现

3.1 简单回顾正则表达式

• 首先要知道匹配什么字符。

1. 字符
   就是说明匹配什么字符。

   其中包含普通字符、转义字符（\t：水平制表符。\v：垂直制表符。\n等）、代表类型的字符（.：匹配除换行符之外的任何单个字符。\w：匹配字母、数字、下划线。\W匹配非字母、数字、下划线。\s：匹配任何空白字符。\S,\d：匹配一个数字字符。\D,\h：十六进制数字字符。\H等，大写表示与小写匹配反逻辑）

• 现在有了对某几个字符进行匹配，如果要对某类字符匹配，那就需要分类了。

2. 分类
   比如：[a-z]：匹配所有的小写字母 。[0-9\.\-]：匹配所有的数字，句号和减号。

• 现在可以对某类字符匹配了，为了说明匹配这几个或者这一类字符的个数，所以需要量词：

3. 量词
   就是说明匹配的数量
   其中包含?：匹配前面的子表达式零次或一次。 *：匹配前面的子表达式任意次。 +：匹配前面的子表达式一次或多次(大于等于1次）等。

• 已经可以匹配一定数量的字符了，为了说明从哪里开始匹配，所以需要锚点：

4. 锚点
   ^xxx ：表示该模式只匹配那些以 xxx 开头的字符串。 xxx& ：用来匹配那些以xxx结尾的字符串。如果没给定锚点，那就是与字符串任意包含该模式的位置匹配。

剩下的就是分组，逻辑运算等细节。

3.2 grammars语言的命名规范

可以看到模板工程"rpt.tmLanguage.json"文件中对于ID为“strings”的模式，它的"name"字段值为"string.quoted.double.rpt"，这里需要注意，我们自己要添加某个模式时，它的"name"字段值必须在TextMate 提供的通用范围列表中选，不可以自己随便命名。

3.3 相关功能的实现

根据.rpt文件内容的特性，我添加了五个模式进行匹配，这里因为本身这些字段也与其真实含义无关，知识要个高亮，所以就按颜色随便选的类型。

• "#keywords" ：匹配关键词Warning、Note
• "#lists" ：匹配标题
• "#strings" ： 匹配表格线
• "#headers" ：匹配表格头
• "#numerics"：匹配数字

{
	"$schema": "https://raw.githubusercontent.com/martinring/tmlanguage/master/tmlanguage.json",
	"name": "rpt",
	"patterns": [
		{
			"include": "#keywords"
		},
		{
			"include": "#lists"
		},
		{
			"include": "#strings"
		},
		{
			"include": "#headers"
		},
		{
			"include": "#numerics"
		}
		
	],
	"repository": {
		"keywords": {
			"patterns": [{
				"name": "variable.other.rpt",
				"match": "Warning|Note"
			}]
		},

		"headers": {
			"patterns": [{
				"name": "keyword.control.rpt",
				"match": "Site Type|Used|Fixed|Available|Util%|Total|Clock Enable|Synchronous|Asynchronous|Ref Name|Functional Category"
			}]
		},

		"lists": {
			"patterns": [{
				"name": "string.unquoted.rpt",
				"match": "^[0-9]+\\.[0-9]*\\s.+"
			}]
		},

		"strings": {
			"patterns": [
				{
					"name": "constant.character.escape.rpt",
					"match": "(^\\+.+\\+$)|(\\|)"
				}
			]
		},
		"numerics": {
			"patterns": [
				{
					"name": "keyword.other",
					"match": "\\b(-?\\d+)(\\.\\d+)?\\b"
				}
			]
		}
	},
	"scopeName": "source.rpt"
}

实现的效果如下：

总体来说稍微好看一点，但还是不是很理想。

4 工程打包

1. 在工程路径下打开命令提示符，执行npm install -g vsce安装vsce

   vsce是“Visual Studio Code Extensions”的缩写，是一个用于打包、发布和管理 VS Code 扩展的命令行工具。
   

2. package.json文件中加入一个字段"publisher": "w0shishabi",，不然会报错。

3. 

4. 删除“README.md”文件中的内容，因为它需要按格式正确编辑，不然也报错。懒得去找就直接全部删除了。

5. 在工程路径下打开命令提示符，执行vsce package对项目进行打包。工程路径下会产生.vsix类型的插件文件。
   

6. 如果需要安装的话选择从VSIX安装，选择对应的.vsix文件安装即可。
   
   

7. 如果需要发布到在线的应用商店，方法在这。