VSCode插件开发全攻略之打包、发布、升级的详细教程

概述

本文将介绍如何使用VSCode插件开发工具将自己编写的插件打包发布至VSCode商店，并能够对插件进行升级。

要发布插件，必须先将代码进行打包。在VSCode的终端中，进入插件所在目录，使用以下命令：

vsce package

执行完成后，将在目录下生成 .vsix 扩展包文件。这是插件打包后上传到VSCode商店的文件。

要将插件发布到VSCode商店，需要创建一个发布者帐户。创建成功后，帐户会收到一封包含访问商店所需的秘钥的电子邮件。使用命令行工具执行以下命令进行登录：

vsce login

输入在创建发布者帐户时填写的电子邮件地址和从邮件中复制的秘钥。如果成功登录，将会显示如下信息：

You are now signed in to the service 'visualstudio.com'.

接下来使用以下命令将插件发布至商店：

vsce publish

如果发布成功，就可以在VSCode商店中搜索并安装你的插件了。此时，你可以将你的插件分享给更多的用户，也可以不断完善并发布新版本。

插件升级是保持插件可用性的关键。VSCode提供了自动检查更新的机制，当插件可更新时，用户将会看到通知。在插件代码更新后，应该将插件的版本号进行更新，以便VSCode可以检查到新版本。

在插件代码更新后，需要打包并发布新版本。可以在 package.json 文件中进行版本号更新：

{
  "version": "1.1.0"
}

更新后的版本号应该要高于原插件的版本号，否则不会触发自动更新。

完成版本号更新后，还需要将新的扩展包文件上传至VSCode商店，执行以下命令：

vsce publish

这样，插件的新版本就可以自动更新到用户的VSCode中了。

创建一个 VS Code 扩展名项目。可以在命令视图中使用以下命令，也可以使用菜单栏的“文件”>“新建文件夹”>“添加文件夹到工作区”来完成。

code --extensions-dir myExtensionsFolder --new-extension myExtension cd myExtension
在仓库的根目录中创建一个“README.md”文件，其中包含您扩展名的说明。创建“package.json”文件以保存有关扩展的信息，并保存其依赖项和设置。从这个模板开始。
在项目目录中添加代码和其他资源（如图标）。可以根据需要在此目录结构下组织代码。例如，使用与常规应用程序类似的文件夹结构来组织代码。
安装VSCode插件打包工具 - VS Code Extension。
在菜单中选择“VS Code Extension: Pack Extension”。或者使用下面的命令：

cd path/to/myExtension vsce package
将文件“myExtension-0.0.1.vsix”上传到市场。
在“package.json”文件中更新“version”字段以指示版本号。从0.0.1更新到0.0.2。然后重新运行第5步和第6步以更新您的扩展。在市场中搜索后，应该能够看到新版本的插件。

创建 VS Code 扩展名项目，如上例所示。
将您的代码推送到 Github 仓库中。
创建 GitHub Actions 工作流程，以在推送代码后自动为您的扩展名执行构建并自动将其部署到市场。在您的GitHub仓库中创建一个名为“.github / workflows / vsce-publish.yml”的文件，如下所示：

name: VSCode Extension CI on: push: branches: - main jobs: build: name: VSCode Extension runs-on: ubuntu-latest steps: - uses: actions/checkout@v2 - name: Use Node.js 12.x uses: actions/setup-node@v1 with: node-version: 12.x - run: npm install - run: npm run package - name: Upload Artifact uses: actions/upload-artifact@v1 with: name: myExtension-0.0.1.vsix path: myExtension-0.0.1.vsix - name: Publish Extension uses: formulahendry/vscode-vsce@v1 with: token: ${{ secrets.VSCE_PAT }} args: publish -p ${ARTIFACTS_PATH}/myExtension-0.0.1.vsix --packagePath=${{ github.workspace }}
在 VSCode 扩展名市场中创建一个 Publisher 账户并生成 pat（个人访问令牌）。为此，请转到 https://publisher.visualstudio.com/ 站点并按照说明进行操作。
在 GitHub 仓库的“Settings”选项卡中，添加一个名为“VSCE_PAT”的新密码类型的存储库级密钥，值为您在第 4 步中生成的 pat 的值。
提交代码更改时，将触发 GitHub Actions 工作流程。作业将自动构建和推送您的扩展名。

这样，当您每次提交代码时，Github Actions都会自动构建和上传您的VSCode插件到商店。如果您需要发布新版本，只需要按照上文提到的升级方法更新版本号后重新提交代码即可。