在 Visual Studio Code 中自定义语法高亮 [英] Customizing syntax highlighting in Visual Studio Code

问题描述

我目前正在尝试为新的文件类型 (ANTLR) 编写扩展程序，并且想知道如何更改 Visual Studio Code 中用于语法突出显示的颜色.对我来说，它看起来好像没有在扩展中定义，而是在其他地方.没有颜色的首选项条目，也没有找到定义它的 CSS 文件(我期望这是因为 vscode 使用的是 Electron).我还查看了生成的设置文件 vscode 和它附带的文件，但也没有任何线索.网络搜索也没有帮助.所以，我现在有点迷失了.

I'm currently trying to write an extension for a new file type (ANTLR) and wonder how to change the colors used for syntax highlighting in Visual Studio Code. To me it looks as if that is not defined in the extension, but somewhere else. There is no preferences entry for colors nor did I find a CSS file which defines that (which I'd expect since vscode is using Electron). I also looked through the settings file vscode generated and files that came with it, but no clue either. Neither did a web search help. So, I'm kinda lost now.

有人能给我一些提示或指向相关文档吗?

Can someone give me some hints or point me to the relevant docs?

推荐答案

这里有两个概念在起作用:

There are two concepts at play here:

• 语言语法，将文本文件转换为具有不同范围的标记，以及
• 主题，以(希望)令人赏心悦目的方式为这些范围着色.

• language grammars, which turn a text file into tokens with different scopes, and
• themes, which colorize those scopes in a (hopefully) eye-pleasing way.

如果您正在编写自己的语法，或从 TextMate 等转换而来，则您可能会使用与主题定义的范围不同的范围.在这种情况下，您定义的标记之间不会有明显的区别，即使它们实际上已定义.

If you're writing your own grammar, or converting from TextMate etc., there's a chance you're using different scopes than the ones defined by the theme. In that case, there won't be a clear distinction between the tokens you define, even if they are actually defined.

有两种方法可以解决这个问题.第一个是，使用您的自定义范围扩展主题并根据需要为它们着色.这不是一个好方法，除非使用您的语言的每个人也喜欢您的配色方案.另一个是，使用 VSCode 和主题作者已经定义和着色的(有限集)范围.很有可能，你的语言在你选择的主题中看起来不错，在其他主题中也足够好.

There are two ways out of this. First one is, extend a theme with your custom scopes and colour them however you want. Not really a good way to go, unless everyone using your language also likes your colour scheme. The other is, use the (limited set of) scopes already defined and colorized by VSCode and the theme authors. Chances are, your language is going to look good in your theme of choice, and good enough in others.

举个例子，这是默认的深色 VSCode 主题定义的 comment 范围.

To give you an example, here's the comment scope as defined by the default dark VSCode theme.

"name": "Dark Visual Studio",
"settings": [
    {
        "scope": "comment",
        "settings": {
            "foreground": "#608b4e"
        }
    },

这里是 C++ 语法中的等效语言片段:

and here's the equivalent language snippet from the C++ grammar:

"comments": {
    "patterns": [
        {
            "captures": {
                "0": {
                    "name": "punctuation.definition.comment.java"
                }
            },
            "match": "/\\*\\*/",
            "name": "comment.block.empty.java"
        },

基本上，该语言根据需要在 comment 下定义了多个标记，并且由于主题说 comment.* 将是绿色的，因此它们的颜色都相同.

Basically, the language defines multiple tokens under comment, as needed, and since the theme says that comment.* will be green, they all get colorized the same.

这篇关于在 Visual Studio Code 中自定义语法高亮的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！