从 Hello World 到核心概念
一、很多人用 VSCode，但不知道扩展是怎么"插"进去的
VSCode 扩展, Contribution Points +1
/**
* 我不知道的 VSCode 扩展
* 共 9 篇文章
*/
export const series = {
name : "我不知道的 VSCode 扩展" ,
count : 9 ,
guide : "我不知道的 VSCode 扩展 — 系列导读与阅读路径" ,
description : "《我不知道的 VSCode 扩展》系列导读、阅读路径与文章索引。" ,
};
文章数量： 9 篇
根据不同背景选择入口：
如果想系统学习： 按编号 01 → 09 顺序阅读
如果只想快速上手写一个扩展： 重点看 01、02、03
如果在排查扩展性能或架构问题： 重点看 05、09
如果准备发布扩展到 Marketplace： 重点看 07、08
| # | 文章 | 核心内容 |
|---|---|---|
| 01 | 从 Hello World 到核心概念 | 环境搭建、项目结构、Contribution Points、Activation Events |
| 02 | 菜单、视图与状态栏 | 右键菜单、TreeView、状态栏、声明式 vs 命令式设计 |
| 03 | Webview 与 Output Channel | Webview 创建与通信、CSP 安全、Output Channel、LogOutputChannel |
| # | 文章 | 核心内容 |
|---|---|---|
| 04 | API 全景与实战技巧 | vscode.window/workspace/languages/tasks/debug 六大模块、Decorations、LSP |
| 05 | 生命周期与激活策略 | 延迟激活、隐式推断、activate/deactivate、subscriptions 资源管理 |
| # | 文章 | 核心内容 |
|---|---|---|
| 06 | 调试与测试 | launch.json 配置、条件/日志断点、Webview 调试、@vscode/test-electron |
| 07 | 发布与 CI/CD 流水线 | @vscode/vsce、package.json 清单、GitHub Actions 自动发布 |
| 08 | 开发工具链与效率提升 | starter-vscode、reactive-vscode、esbuild、webview-ui-toolkit |
| # | 文章 | 核心内容 |
|---|---|---|
| 09 | 架构、进程模型与源码导读 | 多进程架构、Extension Host、IPC 通信链路、源码目录结构 |
一、很多人用 VSCode，但不知道扩展是怎么"插"进去的
上一篇提到，VSCode 扩展的很多能力是通过 package.json 声明式注册的。菜单、视图、状态栏就是最典型的三个——它们决定了用户"看到什么"和"怎么交互"。
上一篇介绍的菜单和树视图能覆盖大部分交互场景，但它们有一个共同的限制——只能展示 VSCode 预定义的 UI 组件。如果需要一个表单、一个图表、一个富文本编辑器，TreeView 就无能为力了。
VSCode 扩展 API 的官方文档列了几百个接口，很多人第一次打开就晕了。其实这些 API 并不是平铺的，而是按职责域组织成几个大模块。理解这张地图，比记住每个方法名重要得多。
VSCode 可以装几百个扩展而启动速度不崩，靠的不是硬件，而是延迟激活机制。
VSCode 扩展运行在一个特殊的环境——Extension Host（扩展宿主进程）。它是 VSCode 启动的一个独立 Node.js 子进程，专门用来加载和执行所有扩展代码。
一、从本地到全球：发布不只是 publish 一下
yo code 生成的项目能跑，但它的工具链选择停留在"能用"的水平——tsc 编译、没有打包器、没有测试框架预配置、没有 CI/CD 模板。对于正经的扩展项目来说，还需要额外的工具补强。
很多人以为 VSCode 是一个单进程应用，但实际上，VSCode 在运行时可以有十几个甚至几十个进程。打开系统的进程管理器，搜索 "Code"，会看到一长串进程列表。