☰

VS Code 中嵌入语言的语法突出显示

tag-icon • tag-icon javascript visual-studio-code
VS Code 中嵌入语言的语法突出显示

我正忙着在 Visual Studio Code 中制作自己的语法扩展。这种语言叫做 Snake，当打开“*.snk”类型的文件（例如“hello-world.snk”）时，语法就会启动。到目前为止，一切顺利。我可以在语法文件中教 VS Code Snake 的语法突出显示，一切都正常。

但我无法获得嵌入语言语法高亮上班。

在“.snk”文件中，可以包含 javascript 代码块。我可以让 VS Code 给出程序语言支持 使这些嵌入的 javascript 代码块中的 javascript（如代码片段）能够正常工作（通过文件embeddedLanguages中的属性tmLanguage.json）。但我无法获取 javascript语法高亮在 javascript 代码块内工作。

事实上，文档完全没有提及语法高亮让嵌入式语言能够正常工作。它只讨论了诸如注释代码和触发代码片段之类的编程功能。

谁能帮我？

答案1

在 packages.json 中

     "embeddedLanguages": {
                    "source.js": "javascript",
                    "meta.embedded.block.javascript": "javascript"
      }

在你的语法 def 文件中：

 "jscode": {
            "patterns": [
                {
                    "name": "js.block.sl",
                    "begin": "js:\\s*{{{",
                    "end": "^\\s*}}}\\s*$",
                    "patterns": [
                        {
                            "begin": "(^|\\G)(\\s*)(.*)",
                            "end": "^\\s*}}}\\s*$",
                            "contentName": "meta.embedded.block.javascript",
                            "patterns": [
                                {
                                    "include": "source.js"
                                }
                            ]
                        }
                    ]
                }
            ]
        },

调整开始和结束模式。

简而言之，您需要匹配块的开始和结束。然后在匹配的块中，匹配 js 并包含所有 js 高亮模式。

我如何学习这个？来自 vscode 源代码。

https://github.com/microsoft/vscode/blob/master/extensions/markdown-basics/package.json

https://github.com/microsoft/vscode/blob/master/extensions/markdown-basics/syntaxes/markdown.tmLanguage.json#L959

答案2

我正在寻找类似的东西，这就是让我印象深刻的东西。

这是我的语言“mylang”的示例模式.tmLanguage.json。它适用于以'或开头"并以相同字符结尾的字符串。在字符串中，转义字符的颜色不同，并且由于“mylang”支持字符串插值，因此您可以拥有诸如 之类的内容"value is $value"，其中变量引用应使用不同的颜色（与整体字符串颜色相比）。

这是基本的嵌入式突出显示，如果您有标记嵌入式语言片段的开始和结束的清晰锚点，您可以调整begin并且end它应该可以工作。

"strings": {
            "name": "string.quoted.double.mylang",
            "begin": "(\"|')",
            "end": "\\1",
            "patterns": [
                {
                    "name": "constant.character.escape.mylang",
                    "match": "\\{[a-z.0-9,A-Z*_/~-]*\\}|\\\\|\\\\0\\d\\d|\\\\\\w"
                },
                {
                    "name": "variable.name.mylang",
                    "match": "\\$[a-z][a-z.0-9A-Z]*|\\$\\([a-z.0-9,A-Z-]*\\)(\\([.0-9-]+\\))?"
                }
            ]
        }

现在，如果我要在代码中定义一个新对象，例如，使用以下语法：

var mjs = JSON('{"value": 42}')

var是语言关键字，JSON是类/类型名称。JSON构造函数采用包含 JSON 文本的字符串，并将其解析为树。

它们有自己的高亮颜色。其中的字符串''有自己的整体颜色。我现在希望正则表达式JSON\\('和之间的所有内容'\\)都基于各种子模式进行着色（例如，键可能是".*"\s+:等等）

请注意，如果我按字面意思指定JSON\\(为开始模式，则将JSON成为其中的一部分，并且不会使用类型名称的颜色突出显示。使用后视可能会有所帮助：(?<JSON)\\(如果我没记错的话。

并将整个过程重复YAML('...'), XML('...'), ...

相关内容