1. VS Code插件开发基础
在开始插件开发之前,我们需要了解一些基础概念:
1.1. 扩展(extension)与插件(plugin)区别
在VS Code中,扩展(extension)与插件(plugin)并没有明确的区分。通常来说,扩展是指一类模块、插件是指实现特定功能的模块。
比如,在安装扩展Marketplace的时候,我们可以选择安装“Python语言支持”这个扩展;而“Python Intellisense”这个插件是实现Python代码提示的模块。
1.2. VS Code API
VS Code提供了丰富的API来方便我们进行插件开发。其中最重要的是vscode命名空间下的各种类和函数。例如,vscode.window可以用来操纵窗口,vscode.workspace可以用来操作工作区等等。
1.3. 插件开发模式
VS Code插件开发常用的开发模式有两种:直接使用VS Code内置的扩展功能API,或者使用yeoman generator进行自动化部署。
2. 开发VS Code插件
下面我们将以编写一个简单的Hello World插件为例来介绍如何开发VS Code插件。
2.1. 创建一个新的VS Code插件项目
首先,在控制台中执行以下命令来创造一个新的VS Code插件项目:
yo code
这里需要确保已经全局安装了yo和generator-code npm install yo generator-code -g。
然后,根据提示进行下一步操作,选择“New Extension”,填写插件信息。欢迎使用以下命令:
cd my-extension
code .
该命令将用VS Code打开您的插件项目。
2.2. 编写Hello World插件
打开src/extension.ts文件,输入以下代码:
// The module 'vscode' contains the VS Code extensibility API
// Import the module and reference it with the alias vscode in your code below
import * as vscode from 'vscode';
// This method is called when your extension is activated
// Your extension is activated the very first time the command is executed
export function activate(context: vscode.ExtensionContext) {
// Use the console to output diagnostic information (console.log) and errors (console.error)
// This line of code will only be executed once when your extension is activated
console.log('Congratulations, your extension "helloworld" is now active!');
// The command has been defined in the package.json file
// Now provide the implementation of the command with registerCommand
// The commandId parameter must match the command field in package.json
let disposable = vscode.commands.registerCommand('extension.sayHello', () => {
// The code you place here will be executed every time your command is executed
// Display a message box to the user
vscode.window.showInformationMessage('Hello World!');
});
context.subscriptions.push(disposable);
}
// this method is called when your extension is deactivated
export function deactivate() {}
这段代码定义了一个名为helloworld的扩展,启动后会打印一条消息,并提供了一个名为“sayHello”的命令。该命令运行后将弹出一个消息框,显示“Hello World!”。
2.3. 调试插件
要在开发过程中调试插件,我们可以使用VS Code内置的调试器。在VS Code中打开插件项目,按F5启动调试器,并在调试主机中选择“扩展(插件)开发主机”,随后在VS Code界面中选择一个开发者实例以便调试插件。如果一切正常,您现在应该可以运行并调试您的插件了。
2.4. 发布插件
要将插件发布到VS Code Marketplace中,您需要先打包扩展。在Visual Studio Code插件项目的根文件夹内,执行以下命令打包扩展:
vsce package
打包后,将生成一个名为helloworld-x.x.x.vsix的文件,默认保存在.vscode/extensions文件夹中。然后,登录VS Code Marketplace,并发布您的扩展。
发布前若不想自己创建“publisher”,可直接访问StoreFront。