VSCode - 更改打字稿函数装饰器

Question

有没有办法在VSCode中更改装饰器的语法高亮颜色？给出一个小例子：

     @HostListener('mouseenter')
     onMouseEnter() {}

@HostListener和onMouseEnter都以相同的颜色突出显示。我想改变这一点。 到目前为止，我尝试弄乱"editor.tokenColorCustomizations": { "functions" : "SomeColorHere"}}，但这会改变装饰器和函数声明。

Answer 1

这是我的配置，按照TODO highlight的建议使用Mark，我排除了require和import以避免干扰js和手写笔

  

屏幕截图上的快速注释：default斜体样式来自here，内联属性来自here

"todohighlight.isEnable": true,
"todohighlight.isCaseSensitive": true,
"todohighlight.keywordsPattern": "@(?!require|import)[\\w-_.]*",
"todohighlight.defaultStyle": {
    "color": "#1E88E5",
    "backgroundColor": "0",
    "fontWeight": "bold"
},
"todohighlight.include": [
    "**/*.js",
    "**/*.ts",
    "**/*.vue",
],
"todohighlight.exclude": [
    "**/node_modules/**",
    "**/bower_components/**",
    "**/dist/**",
    "**/build/**",
    "**/.vscode/**",
    "**/.github/**",
    "**/_output/**",
    "**/*.min.*",
    "**/*.map",
    "**/.next/**"
],
"todohighlight.maxFilesForSearch": 5120,

Answer 2

有关如何查看语法范围的信息，请参阅inspecting textmate scopes及类似内容。所以这样的东西会改变装饰符号@的颜色：

 {
    "scope":  [
       "punctuation.decorator.js", 
        // "meta.decorator.js",
     ],

     "settings": {
        "foreground": "#e100ff",
        "fontStyle": "bold"
     }
}

这只会影响@符号，我找不到为@符号及其相关函数名称着色的方法，也没有其他函数名称。

如果您真的需要，有一种解决方法可以做到这一点。这就是使用像TODO highlight这样的单词荧光笔，制作一个符合你想要的正则表达式。像：

"todohighlight.keywordsPattern": "@[\\w-_]*",

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