扩展 VS Code 语法高亮答案

【问题标题】：Extending VS Code syntax highlighting扩展 VS Code 语法高亮
【发布时间】：2017-10-24 07:44:45
【问题描述】：

有没有办法使用用户设置（或不涉及编写扩展的类似方法）为特定项目扩展 Visual Studio Code 语法突出显示？

我正在使用颜色主题，但想更改 HTML 标签的特定命名空间的语法着色，例如

<div></div> 使用主题中的标准颜色

<ext:div></ext:div> 使用不同的颜色

【问题讨论】：

标签： html visual-studio-code syntax-highlighting

【解决方案1】：

否，在 VSCode 中没有任何东西（没有扩展）可以突出显示任意正则表达式。（嗯，有搜索功能，但突出显示是暂时的。）

无需编写扩展程序或使用现有的扩展程序，最强大的高亮自定义方法是editor.tokenCustomizations 中的editor.tokenCustomizations 机制settings.json。

现在，内置的 TextMate 语法只是将“ext:div”归类为无法识别，因此这种方法最好的方法是更改所有无法识别的标签的突出显示。看起来像这样：

    // https://code.visualstudio.com/docs/getstarted/themes
    "editor.tokenColorCustomizations": {
        "textMateRules": [
            {
                "scope": [
                    "meta.tag.other entity.name.tag",
                ],
                "settings": {
                    "foreground": "#080",
                    "fontStyle": "bold",
                },
            },
        ],
    },

截图：

另请参阅this answer，它更详细地介绍了添加textMateRules 的过程。

【讨论】：

【解决方案2】：

如果您没有找到更好、更标准的方法来执行此操作，扩展程序 TODO Highlight 会为您工作。它通常用于为自己突出显示特殊的 cmets，例如“FIXME”，但可以在您的情况下使用如下正则表达式：

  "todohighlight.keywordsPattern": "\\s*<\\s*\\/{0,1}ext:.*\\s*>",

然后你可以随意设置颜色：

"todohighlight.defaultStyle": {
    "color": "red",
    // "letterSpacing": "1px",
    // "backgroundColor": "rgba(170,102,0,1)",
    "backgroundColor": "transparent"
    // "borderRadius": "4px",
    "isWholeLine": false
},

【讨论】：

这是一个非常有趣的想法，谢谢。唯一的问题是，我目前正在使用 TODO 扩展来突出显示我的 TODO；）我可能只是尝试为我的目的编写一个类似的装饰器。我只是希望有一种简单的方法来扩展当前使用的语法突出显示。
是的，这不是最好的选择，但可能是唯一的选择。您没有理由不能继续使用 TODO 来突出显示 TODO 等。您只需使用“或”添加到 keyWordsPattern 正则表达式 | .
我最终用这个来补充纱线文件的 Yarn Spinner 扩展。谢谢！