vscode插件调试必须用yo code初始化,因其自动生成正确launch.json、out路径映射及sourcemap配置;手动配置易致断点灰掉或不暂停,需确保program指向编译后js、sourcemaps为true、outfiles匹配输出目录。

VSCode插件项目必须用 yo code 初始化才能调试
不是所有 TypeScript 项目都能直接进断点——VSCode 插件调试依赖特定的工程结构和 launch 配置,而 yo code 生成的模板自带 .vscode/launch.json 和正确的 out 输出路径映射。手动新建 TS 项目再补配置,大概率会卡在「断点灰掉」或「命中但不暂停」。
实操建议:
- 务必运行
yo code→ 选「New Extension (TypeScript)」,填好 ID 和名称 - 生成后立刻运行
npm install,不要跳过@types/vscode和vscode-test - 若已手建项目,别硬改,建议另起一个
yo code项目,把源码复制进去,重配package.json中的main和activationEvents
launch.json 的 type: "extensionHost" 必须指向正确入口文件
断点失效最常见原因:launch 配置里 program 指向了未编译的 src/extension.ts,但调试器只认编译后的 JS(默认输出到 out/extension.js)。VSCode 不会自动做 source map 映射,除非你明确告诉它。
实操建议:
- 确认
launch.json中program是"${workspaceFolder}/out/extension.js" - 确保
sourceMaps设为true,且outFiles包含"${workspaceFolder}/out/**/*.js" - 如果用了
tsconfig.json自定义outDir(比如改成dist),launch.json和outFiles必须同步改,否则断点永远不生效
调试时 extension 运行在独立 VSCode 窗口,但 console.log 默认不显示
你在 extension.ts 里写的 console.log 不会出现在主窗口的 DevTools 控制台,也不会打印到终端——它实际输出到「Extension Development Host」窗口的开发者工具中,而且只有打开该窗口的 DevTools 才能看到。
实操建议:
- 启动调试后,等新窗口弹出 → 按
Ctrl+Shift+I(Windows/Linux)或Cmd+Option+I(macOS)打开其 DevTools - 切到「Console」面板,就能看到所有
console.log和未捕获异常 - 如需终端输出,可用
vscode.window.showInformationMessage()或写日志到文件(fs.appendFile),但注意权限和路径(os.tmpdir()更安全)
修改代码后热重载失败?检查 watch 是否启用 + out 文件是否实时更新
按 F5 启动调试后,改完 TS 代码保存,期望自动重新编译并重载 extension,结果没反应——大概率是 TypeScript 监听没跑起来,或者 out/ 下的 JS 文件根本没更新。
实操建议:
- 确认
package.json的scripts里有"watch": "tsc -watch -p ./",且已执行npm run watch(或在 VSCode 终端后台运行) - 观察
out/extension.js时间戳是否随保存变化;没变就说明 tsc 没监听,常见原因是tsconfig.json缺少"include": ["src/**/*"] - 调试期间不要关掉
npm run watch进程,也不要用npm run compile替代——它是单次编译,不监听
package.json 的 main 字段拼错路径、activationEvents 写成 "*" 却忘了触发动作、或者 out/ 被 Git 忽略导致 launch 找不到文件。这些细节不报错,只让断点沉默。











