VSCode 扩展：在我的中嵌入标准语言

Question

我需要在我的语言扩展中嵌入标准语言（例如JavaScript ）。 这意味着，我想看到自动完成，语法higlighting等作为file.js 。 我可以这样做吗（如何）？

感谢您提供任何示例！

Answer 1

您可以在嵌入式语言指南中使用附加语法syntaxes/abc.tmLanguage.json继续abc-lang示例：

{
    "scopeName": "source.abc",
    "patterns": [ { "include": "#expression" } ],
    "repository": {
        "expression": {
            "patterns": [
                { "include": "#letter" },
                { "include": "#paren-expression" },
                { "include": "#code" }
            ]
        },
        "letter": {
            "match": "a|b|c",
            "name": "keyword.letter"
        },
        "paren-expression": {
            "begin": "\\(",
            "end": "\\)",
            "beginCaptures": {
                "0": { "name": "punctuation.paren.open" }
            },
            "endCaptures": {
                "0": { "name": "punctuation.paren.close" }
            },
            "name": "expression.group",
            "patterns": [ { "include": "#expression" } ]
        },
        "code": {
            "begin": "```js",
            "end": "```",
            "beginCaptures": {
                "0": { "name": "punctuation.code.open" }
            },
            "endCaptures": {
                "0": { "name": "punctuation.code.close" }
            },
            "name": "meta.embedded.block.javascript",
            "patterns": [ { "include": "source.js" } ]
        }
    }
}

Matt 评论的固定链接是https://github.com/microsoft/vscode/blob/5712574281bb096a2dd4ceda7e266d507f775b45/extensions/html/syntaxes/html.tmLanguage.json#L1936

Answer 2

语法高亮很容易，只需包含要嵌入的语言的顶级范围。 例如， Html 使用"include": "source.js"在脚本块内添加 js 语法高亮。

智能感知要困难得多。 再次，看看vscode 的 HTML 扩展做了什么。 它基本上将 html 文件拆分为虚拟文档（一个用于脚本块，一个用于样式块，一个用于 html），然后为这些语言中的每一种嵌入所需的语言库以提供 IntelliSense。 Vetur 扩展也做了类似的事情。 在这两种情况下，扩展都拥有顶级文档（html 或 vue），然后根据发出 IntelliSense 请求的位置委托给正确的嵌入式语言