VSCode Tree-sitter 扩展使用教程

VSCode Tree-sitter 扩展使用教程

vscode-tree-sitterAccurate syntax coloring for VSCode using tree-sitter项目地址:https://gitcode.com/gh_mirrors/vs/vscode-tree-sitter

1、项目的目录结构及介绍

VSCode Tree-sitter 扩展的目录结构如下：

vscode-tree-sitter/
├── examples/
├── src/
│   ├── extension.ts
│   ├── semantic-tokens.ts
│   └── tree-sitter.ts
├── package.json
├── README.md
└── tsconfig.json

目录介绍：

• examples/: 包含示例文件，用于测试和展示如何使用 Tree-sitter 解析器。
• src/: 包含扩展的主要源代码文件。
  • extension.ts: 扩展的入口文件，负责注册和启动扩展。
  • semantic-tokens.ts: 处理语义高亮的逻辑。
  • tree-sitter.ts: 与 Tree-sitter 解析器交互的逻辑。
• package.json: 项目的配置文件，包含依赖、脚本和扩展的元数据。
• README.md: 项目的说明文档。
• tsconfig.json: TypeScript 的配置文件。

2、项目的启动文件介绍

extension.ts

extension.ts 是 VSCode Tree-sitter 扩展的入口文件，主要负责以下任务：

• 注册扩展命令。
• 初始化 Tree-sitter 解析器。
• 注册语义高亮提供者。

以下是 extension.ts 的部分代码示例：

import * as vscode from 'vscode';
import { SemanticTokensProvider } from './semantic-tokens';
import { TreeSitter } from './tree-sitter';

export function activate(context: vscode.ExtensionContext) {
    const treeSitter = new TreeSitter();
    const semanticTokensProvider = new SemanticTokensProvider(treeSitter);

    context.subscriptions.push(
        vscode.languages.registerDocumentSemanticTokensProvider({ language: 'yourlang' }, semanticTokensProvider, semanticTokensProvider.legend)
    );
}

export function deactivate() {}

3、项目的配置文件介绍

package.json

package.json 是 Node.js 项目的配置文件，包含以下关键部分：

• name: 扩展的名称。
• version: 扩展的版本号。
• publisher: 扩展的发布者。
• engines: 扩展支持的 VSCode 版本。
• activationEvents: 扩展的激活事件。
• contributes: 扩展的贡献点，如命令、语言支持等。

以下是 package.json 的部分内容示例：

{
  "name": "vscode-tree-sitter",
  "version": "0.1.0",
  "publisher": "georgewfraser",
  "engines": {
    "vscode": "^1.50.0"
  },
  "activationEvents": [
    "onLanguage:yourlang"
  ],
  "contributes": {
    "languages": [{
      "id": "yourlang",
      "extensions": [".yourlang"]
    }]
  }
}

通过以上配置，VSCode 可以识别并加载 Tree-sitter 扩展，提供语法和语义高亮功能。

vscode-tree-sitterAccurate syntax coloring for VSCode using tree-sitter项目地址:https://gitcode.com/gh_mirrors/vs/vscode-tree-sitter