你的第一个扩展
- 安装Yeoman和VS Code Extension Generator:
npm install -g yo generator-code
- 命令行输入
yo code
运行脚手架,并进行自定义:
此时的目录结构如下:
- 此时在新项目中按
F5
会打开调试模式,在新弹窗中输入命令Hello World
,会弹出弹窗,这是初始项目自带的命令
开发插件
以上只是演示官方demo,现在开始走一下开发流程,首先让我们修改一下提示信息:
- 在
extension.js
中修改Hello World
为Hello VS Code
- 在debugger窗口中按
ctrl+r
刷新页面,或者运行reload window
- 再次输入指令
Hello World
应该看到如下效果:
extension.js
// 模块'vscode'包含VS Code扩展API
const vscode = require('vscode');
// 您的扩展将在第一次执行命令时被激活
// 当你的扩展被激活时,触发activated方法,activated方法只执行一次
/**
* @param {vscode.ExtensionContext} context
*/
function activate(context) {
console.log('Congratulations, your extension "git-watch" is now active!');
// 该指令被定义在package.json文件contributes属性中
// 现在使用registerCommand注册命令
// registerCommand的第一个参数必须与package.json中的command匹配
let disposable = vscode.commands.registerCommand('extension.helloWorld', function () {
vscode.window.showInformationMessage('Hello VS Code');
});
context.subscriptions.push(disposable);
}
exports.activate = activate;
// 当你的扩展停用时会调用该方法
function deactivate() {}
module.exports = {
activate,
deactivate
}
package.json
{
"name": "git-watch",
"displayName": "git-watch",
"description": "",
"version": "0.0.1",
"engines": {
"vscode": "^1.35.0"
},
"categories": [
"Other"
],
"activationEvents": [
"onCommand:extension.helloWorld"
],
"main": "./extension.js",
"contributes": {
"commands": [{
"command": "extension.helloWorld",
"title": "Hello World"
}]
},
"scripts": {
"postinstall": "node ./node_modules/vscode/bin/install",
"test": "node ./node_modules/vscode/bin/test"
},
"devDependencies": {
"typescript": "^3.3.1",
"vscode": "^1.1.28",
"eslint": "^5.13.0",
"@types/node": "^10.12.21",
"@types/mocha": "^2.2.42"
}
}