调试 VSCode 扩展需先安装 VSCode、Node.js 和 vsce 工具，并用 yo code 生成项目，其中 .vscode/launch.json 配置了名为 "Extension" 的调试任务，类型为 extensionHost，启动时会加载当前扩展到新窗口（标有 “[Extension Development Host]”），在该窗口中可测试命令或触发事件，原始编辑器中的断点将生效；若断点未命中需检查编译输出路径 outFiles 及 TypeScript 编译状态，推荐使用 tsc -w 监听文件变化并重启调试会话以应用更改，还可通过添加 console: "integratedTerminal" 查看日志，整体依赖扩展宿主机制实现进程隔离与调试连接。
调试 VSCode 扩展本身其实非常直接，VSCode 提供了内置的支持来让你在开发过程中快速测试和调试自己的扩展。以下是具体操作步骤和关键点。
1. 准备调试环境
确保你已经：
- 安装了 Visual Studio Code
- 安装了 Node.js（推荐 LTS 版本）
- 全局安装了 vsce（VSCode 扩展打包工具）：npm install -g vsce
- 用 yo code 生成了一个扩展项目（需要先安装 Yeoman）
生成的项目中会包含 .vscode/launch.json 和 package.json，这些是调试的关键配置文件。
2. 使用默认启动配置
打开你的扩展项目，在 .vscode/launch.json 中应该能看到一个名为 "Extension" 的调试配置，它长这样：
{
"name": "Extension",
"type": "extensionHost",
"request": "launch",
"runtimeExecutable": "${execPath}",
"args": [
"--extensionDevelopmentPath=${workspaceFolder}"
],
"outFiles": [
"${workspaceFolder}/out/**/*.js"
]
}
这个配置的意思是：启动一个新的 VSCode 实例（称为“扩展宿主”），并加载当前项目作为正在开发的扩展。
点击调试侧边栏中的“运行”按钮，VSCode 会：
Vuex参考手册 中文CHM版
下载
Vuex是一个专门为Vue.js应用设计的状态管理模型 + 库。它为应用内的所有组件提供集中式存储服务，其中的规则确保状态只能按预期方式变更。它可以与 Vue 官方开发工具扩展(devtools extension) 集成，提供高级特征，比如 零配置时空旅行般（基于时间轴）调试，以及状态快照 导出/导入。本文给大家带来Vuex参考手册，需要的朋友们可以过来看看！
- 编译你的 TypeScript（如果有）
- 启动一个新窗口（标题通常带有 “[Extension Development Host]”）
- 在这个窗口中激活你的扩展
3. 在开发窗口中测试功能
新打开的窗口就是你的“测试环境”。你可以像正常使用一样操作命令、触发事件等。
例如，如果你注册了一个命令 command:hello.world，可以在命令面板（Ctrl+Shift+P）里执行它。
此时，你在原始代码中设置的断点会被触发，可以查看变量、调用栈、单步执行等。
4. 调试技巧和常见问题
- 确保 outFiles 指向正确的编译输出路径（如 out/**/*.js）
- 如果断点显示为灰色，说明未命中，检查是否代码被正确编译和加载
- 修改代码后，需要重新编译（或开启 tsc -w 监听）再重启调试会话
- 可在 launch.json 中添加 console: "integratedTerminal" 查看后台输出
- 使用 debug console 可以执行表达式、调用 API
基本上就这些。只要项目结构正确，VSCode 的调试体验很流畅。关键是理解“扩展宿主”机制：你的代码在一个独立进程中运行，而调试器连接的是那个进程。
