67

有没有办法扩展 Visual Studio Code 中支持的语言/语法？我想添加自定义语言语法，但我无法找到有关如何提供语言服务的任何信息。

任何人都可以指出现有语言实现的任何参考资料甚至示例吗？

4

5 回答 5

87

新版本 0.9.0 可以实现。有一个关于如何添加自定义语言的官方文档：https ://github.com/microsoft/vscode-docs/blob/main/release-notes/v0_9_0.md

您需要一个.tmLanguage文件，用于您要添加的语言。您可以在 GitHub 上找到现有文件，也可以定义自己的语言文件。看这里了解如何创建一个： http: //manual.macromates.com/en/language_grammars

找到.tmLanguage文件后，您有两种方法可以基于它创建扩展。

选项 1：使用 Yeoman 生成器

  • 安装 node.js（如果你还没有完成）
  • 通过执行安装 yo（如果您还没有完成）npm install -g yo
  • 为代码安装 Yo 生成器：npm install -g generator-code
  • 运行yo code并选择New language support
  • 按照说明操作（定义.tmLangauge文件、定义插件名称、文件扩展名等）
  • 生成器使用当前工作目录中的插件名称为您的扩展创建一个目录。

选项2：自己创建目录

  • 使用您的插件名称（仅小写字母）创建一个目录。假设我们称之为mylang。

  • 添加一个子文件夹syntaxes并将.tmlanguage文件放入其中

  • 在扩展文件夹的根目录中创建一个文件package.json，内容如下

     {
     "name": "mylang",
     "version": "0.0.1",
     "engines": {
         "vscode": ">=0.9.0-pre.1"
     },
     "publisher": "me",
     "contributes": {
         "languages": [{
             "id": "mylang",
             "aliases": ["MyLang", "mylang"],
             "extensions": [".mylang",".myl"]
         }],
         "grammars": [{
             "language": "mylang",
             "scopeName": "source.mylang",
             "path": "./syntaxes/mylang.tmLanguage"
         }]
     }
 }

最后将您的扩展添加到 Visual Studio Code

将扩展文件夹复制到扩展目录。这是：

  • 在Windows上 %USERPROFILE%\.vscode\extensions

  • 在Mac/Linux上 $HOME/.vscode/extensions

重启代码。现在，您的扩展程序将在您每次打开具有指定文件扩展名的文件时自动运行。您可以在右下角看到使用的插件的名称。您可以通过单击扩展名来更改它。如果您的扩展名不是为特定文件扩展名注册的唯一扩展名，那么 Code 可能会选择错误的扩展名。

于 2015-10-07T15:21:54.430 回答
12

为了扩展Wosi 的.tmLanguage答案，使用.tmLanguage文件是可选的。使用常规.json是一种完全有效的方法，而且——在我看来——可读性更好。

例如，请参阅 VSCode_SQF：sqf.json

在 内部package.json，您只需要将路径从 更改./syntaxes/mylang.tmLanguage为./syntaxes/mylang.json。

于 2017-03-04T10:43:48.207 回答
7

使用逆向工程，您可以向 VSCode 添加新语言。你可以看看 typescript 是如何作为 JavaScript 插件实现的，以及它是如何通过管道与 node.exe 通信的。但这是一件困难的事情，因为它完全没有文档，我将在这里提供一个非常简短的文档：

您可以在 plugins 文件夹中定义一个新插件C:\Users\USER\AppData\Local\Code\app-0.3.0\resources\app\plugins。

复制 typescript 插件文件夹并将所有文件中提到的文件扩展名和语言名称重命名为您的新语言，以便在打开 .mylang 文件时使用您的新插件。

在typescriptServiceClient.js您看到一个子进程被分叉并且它stdout被耦合到一个new WireProtocol.Reader. 绑定您自己的mylanguage.exe（您可能需要自己编写该 exe）。VSCode 要求该二进制文件获取更多特定于语言的信息。

您可以在其中typescriptMain.js找到该语言的功能注册。monaco.Modes.XXXXXXSupport.register删除对except的所有调用monaco.Modes.DeclarationSupport.register。

现在在 VSCode 中打开一个包含 .mylang 文件的目录，然后通过 .mylang 打开其中一个CTRL+P + FileName。右键单击标识符并选择Go to Definition。VSCode 现在通过 StdIn 向您的 exe 发送这样的请求

{"seq":1,"type":"request","command":"definition","arguments":{"file":"d:/Projects/MyProj/Source/MyFile.mylang","line":45,"offset":9}}

VSCode 期望得到这样的答案：

Content-Length: 251
[LINE BREAK]
{ "seq" : 1, "type" : "response", "command" : "definition", "request_seq" : 1, "success" : true, "body" : [{ "file" : "d:/Projects/MyProj/Source/MyOtherFile.mylang", "start" : { "line" : 125, "offset" : 3 }, "end" : { "line" : 145, "offset" : 11} }] }

如果一切正常，VSCode 将打开 MyOtherFile.mylang 并将光标设置到第 3 列的第 124 行。

自己试试吧;-)

于 2015-06-24T09:38:13.410 回答
3

您可以在线阅读内置语言扩展的源代码：

https://github.com/microsoft/vscode/tree/main/extensions

您可以选择一个与您的语言语法接近的扩展名并根据需要进行更改。（例如，您可以对 JavaScript 扩展进行一些修改并将其重新命名为与 jQuery 一起使用！）

重要的是要注意，如果您选择的语言与您想要的语言如此不同，这将是太多的工作！如果您没有设法找到与所需语言相似的语言，您可能需要从头开始创建一个全新的扩展 - https://stackoverflow.com/a/32996211/14467698 -。

于 2021-04-23T15:30:39.180 回答
3

恕我直言，截至 2021 年第二季度的最简单配方：

  1. 按照Wosi 的答案中的选项 2 。您只需要两个文件即可开始。只需直接在您的扩展目录中创建文件夹结构。
    • 设置"path": "./syntaxes/your_language.plist"在package.json
  2. 使用IRO构建您的正则表达式。
    • 确保在“范围信息”屏幕中，与 Textmate 相关的任何内容都是绿色的。不要担心其他编辑。
    • 将“Textmate”选项卡的内容保存到上面的路径中，即.syntaxes/your_language.plist
  3. 重新加载 VSCode

而已。我还将 IRO（左窗格）文本保存到我自己的项目中。

于 2021-03-17T03:10:51.837 回答