我想将最简单的(mvp)语言语法和语法高亮添加到 vscode。
这是(imo)一堆TextMate文档(适用两个不同的版本)和随机的互联网建议。我无法制作一个基本示例,也找不到一个。
我将如何添加只有一条规则的语言语法(例如:将“foo”视为
mylang.symbol.foo
)和影响该符号的单一着色规则?
我想将最简单的(mvp)语言语法和语法高亮添加到 vscode。
这是(imo)一堆TextMate文档(适用两个不同的版本)和随机的互联网建议。我无法制作一个基本示例,也找不到一个。
我将如何添加只有一条规则的语言语法(例如:将“foo”视为
mylang.symbol.foo
)和影响该符号的单一着色规则?
语法文件需要在contributes.grammars
部分声明package.json
,这里以语言为例foo
。由于 VSCode 还不知道任何具有该 ID 的语言,我们还需要在这里注册一个新的语言 ID:
{
// ...
"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
,单词foo
将变为红色(bar
不是):
几乎所有这些都应该在 VSCode 的Syntax Highlighting和Color Themes官方文档中涵盖,但更深入。
顺便说一句,VSCode 还支持开箱即用的 XML / plist 格式的 TmLanguage 语法,而不是 JSON,但我发现前者往往更具可读性。实际上,在我看来,用于 TmLanguage 语法的最易读的格式是 YAML,因为它们主要由正则表达式组成,不需要在那里转义。然而,这确实需要一个从 YAML 到 JSON 或 XML 的转换步骤,以便 VSCode 理解它。