扩展结构

在上一节中，我们简单生成了一个Hello World扩展，该Hello World扩展做了 3 件事：

注册激活事件：，以便当用户运行命令时扩展被激活。onCommand onCommand:helloworld.helloWorldHello World
使用贡献点使命令在命令面板中可用，并将其绑定到命令 ID 。contributes.commands Hello Worldhelloworld.helloWorld
使用VS Code API将函数绑定到注册的命令 ID 。commands.registerCommand helloworld.helloWorld

理解这三个概念对于在 VS Code 中编写扩展至关重要：

激活事件：您的分机激活的事件。
贡献点：您在package.json 扩展清单中为扩展 VS Code 所做的静态声明。
VS Code API：一组可以在扩展代码中调用的 JavaScript API。

让我们仔细看看Hello World示例的源代码，看看这些概念如何应用于它。

扩展文件结构

.
├── .vscode
│   ├── launch.json     // Config for launching and debugging the extension
│   └── tasks.json      // Config for build task that compiles TypeScript
├── .gitignore          // Ignore build output and node_modules
├── README.md           // Readable description of your extension's functionality
├── src
│   └── extension.ts    // Extension source code
├── package.json        // Extension manifest
├── tsconfig.json       // TypeScript configuration

您可以阅读有关配置文件的更多信息：

launch.json用于配置VS Code调试
tasks.json用于定义 VS Code任务
tsconfig.json请参阅 TypeScript手册

不过，让我们重点关注package.json和extension.ts。

扩展清单

每个 VS Code 扩展都必须有一个扩展清单package.json作为其扩展清单。包含package.jsonNode.js 字段（例如scripts和）devDependencies和 VS Code 特定字段（例如publisher、activationEvents和）的混合contributes。您可以在扩展清单参考中找到所有 VS Code 特定字段的描述。以下是一些最重要的字段：

name和publisher：VS Code 用作<publisher>.<name>扩展的唯一 ID。例如，Hello World 示例的 ID 为vscode-samples.helloworld-sample。VS Code 使用 ID 来唯一标识您的扩展。
main：扩展入口点。
activationEvents以及contributes：激活事件和贡献点。
engines.vscode：指定扩展所依赖的 VS Code API 的最低版本。

{
  "name": "helloworld-sample",
  "displayName": "helloworld-sample",
  "description": "HelloWorld example for VS Code",
  "version": "0.0.1",
  "publisher": "vscode-samples",
  "repository": "https://github.com/microsoft/vscode-extension-samples/helloworld-sample",
  "engines": {
    "vscode": "^1.51.0"
  },
  "categories": ["Other"],
  "activationEvents": [],
  "main": "./out/extension.js",
  "contributes": {
    "commands": [
      {
        "command": "helloworld.helloWorld",
        "title": "Hello World"
      }
    ]
  },
  "scripts": {
    "vscode:prepublish": "npm run compile",
    "compile": "tsc -p ./",
    "watch": "tsc -watch -p ./"
  },
  "devDependencies": {
    "@types/node": "^8.10.25",
    "@types/vscode": "^1.51.0",
    "tslint": "^5.16.0",
    "typescript": "^3.4.5"
  }
}

注意

注意：如果您的扩展针对 1.74 之前的 VS Code 版本，则必须onCommand:helloworld.helloWorld在activationEvents.

扩展入口文件

扩展入口文件导出两个函数，activate以及deactivate。你注册的激活事件被触发之时执行activate，deactivate则提供了扩展关闭前执行清理工作的机会。对于许多扩展，可能不需要显式清理，可以删除该方法。但是，如果扩展需要在 VS Code 关闭或扩展被禁用或卸载时执行操作，则可以使用此方法。

VS代码扩展API是在@types/vscode类型定义中声明的。vscode类型定义的版本由package.json中engines.vscode字段中的值控制。vscode类型在代码中为您提供IntelliSense、Go to Definition和其他TypeScript语言功能。

// 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-sample" 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('helloworld.helloWorld', () => {
    // 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() {}

扩展结构 ​

扩展文件结构 ​

扩展清单 ​

扩展入口文件 ​

扩展结构

扩展文件结构

扩展清单

扩展入口文件