在 Visual Studio Code 中创建自定义语言 [英] Create Custom Language in Visual Studio Code

查看:69
本文介绍了在 Visual Studio Code 中创建自定义语言的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

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

Is there a way to extend the supported languages/grammars in Visual Studio Code? I'd like to add a custom language syntax, but I've not been able to find any information on how language services are provided.

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

Can anybody point to any references or even examples of existing language implementations?

推荐答案

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

It's possible with the new version 0.9.0. There's an official documentation on how to add a custom language: https://github.com/microsoft/vscode-docs/blob/main/release-notes/v0_9_0.md

对于要添加的语言,您需要一个 .tmLanguage 文件.您可以找到现有文件,例如在 GitHub 上,或者您可以定义自己的语言文件.查看此处了解如何创建一个:http://manual.macromates.com/en/语言语法

You need a .tmLanguage file for the language you want to add. You can find existing files e.g. on GitHub or you can define your own language file. Look here to get an idea of how to create one: http://manual.macromates.com/en/language_grammars

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

After finding a .tmLanguage file you have two ways to create an extension based on it.

选项 1:使用 Yeoman 生成器

  • 安装 node.js(如果你还没有安装)
  • 通过执行 npm install -g yo
  • 安装 yo(如果你还没有安装)
  • 为代码安装 Yo 生成器:npm install -g generator-code
  • 运行yo code并选择New language support
  • 按照说明操作(定义 .tmLangauge 文件,定义插件名称、文件扩展名等)
  • 生成器使用当前工作目录中的插件名称为您的扩展创建一个目录.
  • Install node.js (if you haven't already done)
  • Install yo (if you haven't already done) by executing npm install -g yo
  • Install the Yo generator for code: npm install -g generator-code
  • Run yo code and select New language support
  • Follow the instructions (define the .tmLangauge file, define the plugin name, file extensions etc.)
  • The generator creates a directory for your extension with the name of the plugin in your current working directory.

选项 2:自己创建目录

  • 使用您的插件名称(仅小写字母)创建一个目录.假设我们称它为 mylang.

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

Add a subfolder syntaxes and place the .tmlanguage file inside of it

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

Create a file package.json inside the root of the extension folder with content like this

 {
     "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

将扩展文件夹复制到扩展目录.这是:

Copy the extension folder to the extension directory. This is:

  • Windows%USERPROFILE%.vscodeextensions

Mac/Linux$HOME/.vscode/extensions

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

Restart Code. Now your extension will run automatically everytime you open a file with the specified file extension. You can see the name of the used plugin in the down right corner. You can change it by clicking on the name of the extension. If your extension is not the only one registered for a specific file extension then Code may chooses the wrong one.

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

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆