怎样使用VSCode的扩展API？

29次阅读

使用 VSCode 扩展 API 需先安装 Node.js 和 yo generator-code，通过 yo code 创建项目；核心是 package.json 中的 activationEvents 和 contributes 配置，以及 extension.ts 中的 activate 函数；常用操作包括注册命令、编辑文本、监听事件；调试时按 F5 启动扩展主机，发布前需用 vsce 工具打包并登录发布；关键在于正确设置激活事件与权限声明。

怎样使用VSCode的扩展API？

使用 VSCode 的扩展 API 主要是通过编写插件（即扩展）来增强编辑器功能。你需要用 TypeScript 或 JavaScript 编写代码，并利用 VSCode 提供的 vscode 模块来访问编辑器的功能，比如操作文本、添加命令、创建侧边栏、监听事件等。

1. 准备开发环境

确保你已安装：

Node.js（推荐 LTS 版本）
VSCode
Yeoman 和 VS Code Extension Generator：
npm install -g yo generator-code

运行 yo code 创建一个新的扩展项目，选择 TypeScript 或 JavaScript 模板。

2. 理解核心结构：package.json 与 extension.ts

每个扩展都有一个 package.json 文件，其中定义了激活事件、贡献点和命令等信息。关键字段包括：

activationEvents：指定何时激活扩展，例如 onCommand:myExtension.helloWorld
contributes：定义菜单、按钮、配置项等 UI 贡献

主逻辑在 extension.ts（或 .js）中的 activate 函数执行。这是入口点。

3. 常用 API 示例

在 extension.ts 中导入 vscode 模块：

壁纸样机神器

免费壁纸样机生成

0

查看详情

import * as vscode from ‘vscode’;

常见操作示例：

注册命令： vscode.commands.registerCommand(‘myExtension.helloWorld’, () => {
vscode.window.showInformationMessage(‘Hello World!’);
});
操作当前编辑器内容： const editor = vscode.window.activeTextEditor;
if (editor) {
  editor.edit(editBuilder => {
    editBuilder.insert(editor.selection.start, “Hello”);
  });
}
监听事件（如文件保存）： vscode.workspace.onDidSaveTextDocument((doc) => {
console.log(‘Saved:’, doc.fileName);
});