【VSCode】插件开发——基础的基础

目录
1. VSCode 插件能干啥？
2. HelloWorld
3. 核心目录结构
4. 核心概念
    4.1. Activation Events
    4.2. Contribution Points
    4.3. VS Code API

1. VSCode 插件能干啥？

• Change the look of VS Code with a color or file icon theme - Theming
• Add custom components & views in the UI - Extending the Workbench
• Create a Webview to display a custom webpage built with HTML/CSS/JS - Webview Guide
• Support a new programming language - Language Extensions Overview
• Support debugging a specific runtime - Debugger Extension Guide

2. HelloWorld

• 安装 NodeJS
• 安装 Git
• 安装 Yeoman
• 安装 VS Code Extension Generator

npm install -g yo generator-code

• 使用 VS Code Extension Generator 生成一个基础项目

yo code

• 打开 helloworld 项目

cd helloworld
code .

• 启动 helloworld 项目

F5
Ctrl+Shift+P
  -> helloworld

3. 核心目录结构

.
├── .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

4. 核心概念

• Activation Events: events upon which your extension becomes active.
• Contribution Points: static declarations that you make in the package.json Extension Manifest to extend VS Code.
• VS Code API: a set of JavaScript APIs that you can invoke in your extension code.

4.1. Activation Events

Activation Events is a set of JSON declarations that you make in the activationEvents field of package.json Extension Manifest. Your extension becomes activated when the Activation Event happens.

例如：

4.2. Contribution Points

Contribution Points are a set of JSON declarations that you make in the contributes field of the package.json Extension Manifest. Your extension registers Contribution Points to extend various functionalities within Visual Studio Code.

例如：

4.3. VS Code API

VS Code API is a set of JavaScript APIs that you can invoke in your Visual Studio Code extension.

例如：

参考：

VSCode Extension API： https://code.visualstudio.com/api Yo Code - Extension and Customization Generator： https://www.npmjs.com/package/generator-code Activation Events： https://code.visualstudio.com/api/references/activation-events