如何在 VSCode 扩展中自定义自定义语法标记的颜色答案

【问题标题】：How to customize the color of custom syntax tokens in VSCode extension如何在 VSCode 扩展中自定义自定义语法标记的颜色
【发布时间】：2018-03-04 18:24:38
【问题描述】：

TLDR;如果不是用户必须启用的颜色主题，如何让扩展程序为扩展程序定义的语法着色？

我正在尝试将此 Sublime Text plugin (ToDone) 移植到 VSCode。

它为待办事项列表创建语法，然后使用语法突出显示来强调重要任务、静音已完成任务等。

我通过Customize a Color Theme找到了"editor.tokenColorCustomizations"。当我在我的用户设置中使用它时，它适用于新语法，但当我在扩展清单的 package.json#contributes 部分中使用它时会失败。

{
    "contributes": {
        "languages": [
            {
                "id": "todone",
                "aliases": [
                    "ToDone",
                    "To-Done"
                ],
                "extensions": [
                    ".todone",
                    ".todo"
                ]
            }
        ],
        "grammars": [
            {
                "language": "todone",
                "scopeName": "text.todone",
                "path": "./todone.tmLanguage"
            }
        ],
        "configurationDefaults": {
            "[todone]": {
                "editor.insertSpaces": false,
                "editor.tokenColorCustomizations": {
                    "textMateRules": [
                        {
                            "scope": "symbol.definition.task-heading.todone",
                            "settings": {
                                "foreground": "#ff8800"
                            }
                        }
                    ]
                }
            }
        }
    }
}

到目前为止，语法似乎还可以——这正是 Sublime 插件使用的语法，并且用户设置中的颜色得到了正确应用。此外，设置的格式似乎没问题，因为正在应用 "editor.insertSpaces" 并且颜色在用户设置中出现时有效。

最后，我在扩展 package.json 中的 "editor.tokenColorCustomizations" 设置上收到一条非常令人失望的 'Warning' 'Unknown editor configuration setting' 消息。

那么，听起来好像没有为扩展启用此设置？

我看到的另一个可能的方法是使用装饰器。但是，在检查与文档中的部分文本关联的语法标记时，我没有看到任何内容，例如某种方式来遍历文档的语法标记以应用装饰器。因此，与“editor.tokenColorCustomizations”相比，装饰器路线听起来有点困难。

任何关于如何使这项工作的建议将不胜感激。

编辑： 到目前为止，代码在 GitHub 上：tiffon/vscode-todone

【问题讨论】：

有一个similar question 有答案
我偶然发现了同样的问题，@tiffon。您提供的链接让我想起了主题扩展，我开始查看其中一个的来源：github.com/dracula/visual-studio-code/blob/… 也许有办法做到这一点。不确定这是否意味着我必须写一个完整的主题，但无论如何我可能会探索它。如果您探索它，请告诉我。
@PEZ 我有一段时间没有尝试过，已经使用我的个人设置来达到此处所述的预期效果（github.com/tiffon/vscode-todone#how-to-install）。无法扩展，但对我来说足够有用。
过去几年对此有何更新？我在 2021 年面临同样的问题？
你没有理解工具的精神。 VS Code 最大的卖点之一（有点用词不当，因为它没有出售，但已经给出）是它的高度可定制性。从字面上看，编辑器的每个部分，每个图标，每个文本，呈现和用户查看的所有内容都必须分配一个可由用户自定义的属性。您别无选择，只能贡献以某种方式可定制的语法。您可以采用其他属性颜色的方式来执行此操作，但该属性也可以由主题/或用户更改。

标签： visual-studio-code syntax-highlighting vscode-extensions vscode-settings

【解决方案1】：

仅当您指定特定语言时它才会失败。如果我不指定 todone 扩展名，它对我有用。

"configurationDefaults": {
    "editor.insertSpaces": false,
    "editor.tokenColorCustomizations": {
      "textMateRules": [
        {
          "scope": "symbol.definition.task-heading.todone",
          "settings": {
            "foreground": "#ff8800"
          }
        }
      ]
    }
  }

【讨论】：