VSCode插件调试断点不生效，主因是sourceMapPathOverrides未配对、webRoot路径错误或插件未生成有效source map；需确保webpack devtool设为source-map/inline-source-map，sources字段与映射规则严格一致，且webRoot指向项目根目录。
VSCode 插件调试时断点不生效，基本就是 sourceMapPathOverrides 没配对、webRoot 指错了，或者插件本身没生成真实 source map。
为什么插件源码断点打不进？
VSCode 调试插件（比如用 pwa-chrome 或 pwa-msedge 启动浏览器）时，它靠的是插件 bundle 里嵌入或外链的 sourcemap 文件，再结合 sourceMapPathOverrides 把浏览器里看到的路径（如 webpack:///./src/extension.ts）映射回你本地磁盘上的真实文件。一旦映射失败，就显示 “No source available”，断点变灰。
常见错误现象：
- 断点打了但 F5 后完全不触发
- Chrome DevTools 里能看源码，VSCode 里却是空白或只显示压缩后代码
- 右键“Reveal in sidebar”看到路径是
webpack://my-extension/src/...，但配置里只写了webpack:///src/*
根本原因不是插件没开 sourcemap，而是三者没对齐：Webpack 的 devtool 输出格式、sourcemap 中的 sources 字段内容、VSCode 的 sourceMapPathOverrides 规则。
devtool 必须设为 source-map 或 inline-source-map
很多插件脚手架（如 yo code、vscode-extension-samples）默认用 eval-source-map 或 cheap-module-eval-source-map，这类模式把映射信息塞进 eval() 字符串，VSCode 调试器无法解析路径，断点必然失效。
正确做法：
- 在
webpack.config.js中显式写：devtool: "source-map"（推荐）或"inline-source-map" - 如果用 ts-loader，确保
compilerOptions.sourceMap: true已启用 - 避免
eval系列——它们对热更新友好，但对 VSCode 调试不友好 - CLI 启动时加
--devtool source-map也行，但不如配置文件稳定
注意：Vite 或 esbuild 构建的插件不走 Webpack，得查对应文档开 sourcemap（如 Vite 的 build.sourcemap: true）。
sourceMapPathOverrides 怎么写才不映射失败
VSCode 先从 sourcemap 的 sources 字段读路径（例如 webpack://my-extension/src/extension.ts），再按 sourceMapPathOverrides 里的键值对做字符串替换，最后拼上 webRoot 找本地文件。错一个斜杠、少一个前缀，就找不到。
实操要点：
-
webRoot必须是插件项目根目录（即package.json和webpack.config.js所在位置），不是src/也不是dist/ - 所有路径用正斜杠
/，Windows 下也别用\ - 先在 Chrome DevTools 的 Sources 面板右键 bundle → “Reveal in sidebar”，看左侧显示的完整路径前缀是什么
- 典型映射规则（根据常见构建输出）：
"sourceMapPathOverrides": {
"webpack://my-extension/src/*": "${webRoot}/src/*",
"webpack:///src/*": "${webRoot}/src/*",
"webpack:///./*": "${webRoot}/*"
}
如果你用了 monorepo 或自定义 alias（如 @ext/utils），还得加一行："webpack:///@ext/*": "${webRoot}/src/utils/*"。
launch.json 里 url 和 webRoot 必须严格匹配启动方式
插件调试分两类场景：Webview 调试（打开 HTML 页面）和 Extension Host 调试（直接 attach 到 VSCode 进程）。这里说的是前者，即用浏览器打开插件提供的 webview 或本地服务页面。
关键参数检查项：
-
type必须是pwa-chrome或pwa-msedge，不能是旧版chrome -
url必须和你实际访问的地址完全一致（包括端口、路径、协议），比如http://localhost:3000，而不是http://127.0.0.1:3000 -
webRoot值必须和sourceMapPathOverrides里引用的${webRoot}一致，且指向真实项目根目录 - 如果插件启用了 webpack-dev-server，确保它读的是你改过的配置，不是缓存副本（可加
--no-cache启动）
容易被忽略的一点：某些插件模板会在 dist/ 下生成 HTML，此时 webRoot 应该设为 "${workspaceFolder}/dist"，否则 VSCode 会去 src/ 下找 JS 文件，自然失败。
