如何快速开发 VsCode 插件？
VsCode ，是微软所推出的一款免费的跨平台代码编辑器，用于 OS X，Linux 和 Windows；这款应用基于 Electron 开发，源码则由 TypeScript 编写。它自诞生伊始，就拥有一流性能；并且内置诸多功能比如：智能提示、从编辑器调试代码、内置 Git 命令、可扩展和可定制、以及与现有工具的轻量级集成，诸此等等；鉴于此它如众星捧月一般，深受开发者喜爱，你可以在其开源项目 Visual Studio Code 中一窥它的火热程度。
本文即在探讨：如何快速开发 VsCode 插件。
安装工具包
npm install -g yo generator-code
初始化项目生成
yo code
按照提示一步步选择即可；推荐选择，TypeScript ，不选 Webpack 构建。
重要文件说明
package.json
{
"name": "nicelinks.site", // 插件名
"displayName": "倾城之链", // 显示在应用市场的名字
"description": "倾城之链，一款在线导航平台，专注优质、免费资源网站", // 具体描述
"version": "0.1.0", // 插件的版本号
"engines": {
"vscode": "^1.60.0" // 最低支持的 vscode 版本
},
"categories": [
"Other" // 扩展类别
],
// 激活事件组，在哪些事件情况下被激活(*：启动 vscode，插件就会被激活)
"activationEvents": [
"onCommand:demo.helloWorld"
],
// 插件的主入口文件【重要】
"main": "./extension.js",
"contributes": {
// 命令
"commands": [
{
"command": "extension.nicelinks.site",
"title": "倾城之链"
}
]
},
"scripts": {
"lint": "eslint .",
"pretest": "npm run lint",
"test": "node ./test/runTest.js"
},
// 开发依赖项
"devDependencies": {
"@types/vscode": "^1.60.0",
"@types/glob": "^7.1.3",
"@types/mocha": "^8.2.2",
"@types/node": "14.x",
"eslint": "^7.27.0",
"glob": "^7.1.7",
"mocha": "^8.4.0",
"typescript": "^4.3.2",
"vscode-test": "^1.5.2"
}
}
其中，值得说明是 activationEvents 字段，指明该插件在何种情况下才会被激活，因为只有激活后插件才能被正常使用；更多内容，VsCode 官方文档有做详细说明：Activation Events。另外，通过扩展注册 contributes，可用来扩展 Visual Studio Code 中的各项技能，其有多个配置，详情可参见官方说明：Contribution Points。
extension.js
该文件时其入口文件，即 package.json 中 main 字段对应的文件（可不叫 extension.js 这个名字，只需与 main 字段中的值对应即可）；该文件中将导出两个方法：activate（这是插件被激活时执行的函数） 和 deactivate（这是插件被销毁时调用的方法，比如释放内存等）。
'use strict'
import * as vscode from 'vscode'
import { compile } from './helper/utils'
export const COMMAND_NAME = 'extension.nicelinks.site'
export function activate(context: vscode.ExtensionContext) {
console.log('Congratulations, your extension "nicelinks.site" is now active!')
context.subscriptions.push(
vscode.commands.registerCommand(COMMAND_NAME, () => {
// Do what you want to do
vscode.window.showInformationMessage(`恭喜您，开启了 VsCode 插件开发旅程`, { modal: true })
}
)
)}
export function deactivate() {}
备注：如上代码中，注册的命令名，当与 package.json 中的 command 相匹配。
调试
打开 *.ts(js) 文件，按 F5 ，即可快速开始调试；成功开启调试，会打开的 Vscode 新窗口，基于快捷键 command shift p（Mac 系统），输入 command ，一切顺利的话，即可显现出您预期想要的内容。当然，您也可以在代码中插入 debugger，从而调试代码。
发布
插件开发完毕，可打包成 vsix 插件，自行安装使用；也可注册开发者账号，发布到官网应用市场；值得一提的是，VsCode 插件的发布，和 npm 一样，无需审核。
安装 vsce
npm i vsce -g
基于 vsce 打包
vsce package
项目创建
vsce create-publisher [Azure DeOps NAME]
项目发布
vsce publish
成功之后，会弹出一个链接，略等几分钟之后，即可点击链接查看你发布的插件。或者前往插件市场检索你的插件。
