代码之家  ›  专栏  ›  技术社区  ›  SimplGy

如何向VSCode添加基本语法?

  •  1
  • SimplGy  · 技术社区  · 7 年前

    我想补充一点 (mvp)向vscode突出显示语言语法和语法。

    如何添加只有一条规则的语言语法(例如:将“foo”视为 mylang.symbol.foo ),以及影响此符号的单一着色规则?

    1 回复  |  直到 7 年前
        1
  •  13
  •   Gama11 zzapper    7 年前

    语法文件需要在 contributes.grammars 部分 package.json ,这里是一个示例语言 foo

    {
        // ...
        "contributes": {
            "grammars": [
                {
                    "language": "foo",
                    "scopeName": "source.foo",
                    "path": "grammar.json"
                }
            ],
            "languages": [
                {
                    "id": "foo",
                    "extensions": ["foo"]
                }
            ]
        }
    }
    

    grammar.json

    {
        "scopeName": "source.foo",
        "patterns": [
            {
                "match": "foo",
                "name": "mylang.symbol.foo"
            }
        ]
    }
    

    这个 Developer: Inspect TM Scopes


    mylang.symbol.foo 要以特定的方式着色,扩展还需要在中贡献一个主题 package.json :

    {
        // ...
        "contributes": {
            // ...
            "themes": [
                {
                    "label": "foo",
                    "id": "foo",
                    "uiTheme": "vs-dark",
                    "path": "theme.json"
                }
            ]
        }
    }
    

    theme.json 看起来像这样:

    {
        "$schema": "vscode://schemas/color-theme",
        "name": "Foo Theme",
        "tokenColors": [
            {
                "scope": "mylang.symbol.foo",
                "settings": {
                    "foreground": "#FF0000"
                }
            }
        ]
    }
    

    在使用 Preferences: Color Theme 命令,这个词 将被涂成红色(和 bar 不是):


    Syntax Highlighting Color Themes ,但更深入。

    顺便说一句,VSCode也支持XML/plist格式的TmLanguage语法,而不是JSON,但我发现前者更易于阅读。实际上,在我看来,TML语言语法最可读的格式是YAML,因为它们主要由正则表达式组成,不需要在那里转义。然而,这确实需要从YAML到JSON或XML的转换步骤,以便VSCode理解它。