如何在 Visual Studio Code 中自定义 HTML 模板道具的颜色？答案

【问题标题】：How to customize color of HTML template props in Visual Studio Code?如何在 Visual Studio Code 中自定义 HTML 模板道具的颜色？
【发布时间】：2019-03-14 00:24:06
【问题描述】：

使用Developer: Inspect TM scopes检查以下代码中的小胡子内容

<p>name: {{ name }}</p>

我得到text.html.basic，这意味着没有单独的范围可以更改小胡子标签内name 的颜色。有没有其他方法可以改变 Visual Studio Code 中模板道具的颜色？

【问题讨论】：

标签： visual-studio-code vscode-settings

【解决方案1】：

如果您没有找到更好的使用范围的方法，您可以尝试highlight extension。

而且这个设置似乎有效：

"highlight.regexes": {

    "({{[/!^>#]*\\s*)([^}]+)(\\s*}})": [
         {},  // first match group "{{" gets no color, must be here
         {
            // "overviewRulerColor": "#ffcc00",
            "color": "#f00",
            // "fontWeight": "bold"
         },
         {} // third match group "}}" gets no color, does not need to be here
     ],
}

【讨论】：

编辑：更改了正则表达式，以便更好地捕获模板道具并更新图像示例。
我认为您在中间缺少)。你写它的方式还不如去掉第三种模式。这是一个用于角度道具绑定的："(\\s+\\[[\\w-]+\\]=\"[/!^>#]*)([^\"]+)"
你在你的 cmets 上是对的，我在正则表达式上的一个错字，如果你什么都不做，最后一个匹配组不需要包括在内。