vscode插件编写与发布

mzhyui

已于 2024-05-16 18:17:34 修改

阅读量505

点赞数 5

文章标签： vscode ide 编辑器

于 2024-02-09 18:31:49 首次发布

本文链接：https://blog.csdn.net/mzhyui/article/details/136087595

版权

本文详细介绍了如何从安装Node.js和npm，创建插件项目，生成插件骨架，编写插件逻辑，到测试、配置、打包和最终在线发布的整个过程，包括VSCode插件市场的接入和管理。

摘要由CSDN通过智能技术生成

准备工作

安装 Node.js 和 npm：VSCode 插件通常使用 TypeScript 或 JavaScript 编写，因此需要 Node.js 环境。
安装 VSCode 插件生成器：可以通过运行 npm install -g yo generator-code 来安装 Yeoman 和 VSCode 插件生成器。

创建插件项目

生成插件骨架：运行 yo code 并按照提示设置插件（例如插件名称、描述）。（该步骤可以自动配置项目目录并启用git版本控制）
编写插件逻辑：在生成的项目中，主要的工作集中在 extension.ts 文件中。
项目配置：在package.json中编辑插件的版本信息以及相关设置信息。需要手动添加的信息包括publisher以及git上游路径。

测试和发布

测试：在 VSCode 中打开插件项目，按 F5 运行和测试插件。
发布：如果满意，可以将插件发布到 VSCode 插件市场。

5. 打包和发布插件

一旦您对插件感到满意，可以使用 vsce 工具来打包插件。首先需要全局安装 vsce：

npm install -g vsce

（可选）在修改版本或进行版本控制时，可以使用npm对版本号进行调整

npm version minor

然后在项目根目录下运行 vsce命令来创建插件的 .vsix 文件。

 vsce package

要发布到 VSCode 插件市场，您需要创建一个 Microsoft Azure DevOps 账户，并按照 VSCode 插件发布指南操作。

如何发布一个vscode插件 - 掘金 (juejin.cn)

本地发布

在Azure DevOps Services | Microsoft Azure中创建角色，配置项目，获取access token，并配置到本地的vesc中，然后使用

vsce login <publisher name>

vsce publish

进行插件发布

注意，在package.json文件中可能不会自动设置发布者，需要在全局块中加入publisher信息，例如：

{
  "name": "my-vscode-extension",
  "version": "0.1.0",
  "publisher": "your-publisher-id",
  "engines": {
    "vscode": "^1.50.0"
  },
  "activationEvents": [
    "onCommand:extension.sayHello"
  ],
  "main": "./out/extension.js",
  "contributes": {
    "commands": [
      {
        "command": "extension.sayHello",
        "title": "Hello World"
      }
    ]
  },
  "scripts": {
    "vscode:prepublish": "npm run compile",
    "compile": "tsc -p ./",
    "watch": "tsc -watch -p ./",
    "postinstall": "node ./node_modules/vscode/bin/install",
    "test": "node ./node_modules/vscode/bin/test"
  },
  "devDependencies": {
    "typescript": "^4.0.3",
    "vscode": "^1.1.36",
    "tslint": "^5.20.1",
    "@types/node": "^12.11.7",
    "@types/mocha": "^5.2.7"
  },
  "dependencies": {}
}