vscode断点停在bundle.js上是因为chrome未加载sourcemap，导致无法传递原始文件位置；需确认构建生成有效.map文件、sourcemappingurl可访问、outfiles精准匹配编译js路径、webroot与sourcemappathoverrides正确拼接源码路径。
VSCode 本身不能“反混淆”JavaScript，它靠 SourceMap 把混淆后的代码行号、变量名映射回原始源码——前提是构建阶段生成了可用的 .map 文件，且调试配置能准确找到它。
Chrome DevTools 能跳源码，VSCode 断点却停在 bundle.js 上
这不是 VSCode 的锅，而是 Chrome 没把映射信息传过来。VSCode 不解析 .map，它只接收 Chrome 调试协议发来的“原始文件位置”。如果 Chrome 自己没加载 sourcemap，VSCode 就只能对着混淆代码打点。
- 打开 Chrome DevTools → Sources 面板 → 展开
webpack://或file://，看有没有你的src/目录结构；没有就说明构建根本没产出有效 sourcemap - 检查编译后的 JS 文件末尾是否有
//# sourceMappingURL=xxx.js.map，且该路径浏览器能直接访问（比如本地开发时，xxx.js.map必须和xxx.js同目录） - Webpack 用户注意：
devtool: 'eval-source-map'在 HMR 场景下容易断点偏移，换成'source-map'或'inline-source-map'更稳
launch.json 中 outFiles 填错，sourceMaps:true 就是摆设
sourceMaps: true 只是个开关，真正决定“JS 映射到哪去”的是 outFiles —— 它告诉 VSCode：“这些 JS 是编译产物，请用它们的 .map 去反查源码”。填错路径，VSCode 根本不会尝试加载 sourcemap。
-
outFiles必须指向编译后的 JS 文件（不是 TS），例如：["${workspaceFolder}/dist/**/*.js"] - 如果打包输出多个目录（如
dist/es/+dist/cjs/），outFiles要全部覆盖，漏一个就可能断点失效 - Vite 用户注意：
vite build默认关闭 sourcemap，必须在vite.config.ts中显式加build.sourcemap: true
webRoot 和 sourceMapPathOverrides 拼错，原始文件就找不到
VSCode 用 webRoot 去“解释” sourcemap 里的 sources 字段。比如 sourcemap 里写的是 webpack:///./src/main.ts，VSCode 就会拿 webRoot 拼出完整路径去找这个文件。拼错 = 找不到 = 断点灰掉。
- 常见错误：项目根目录是
my-app/，但webRoot写成"${workspaceFolder}/src"，结果 VSCode 去my-app/src/src/main.ts找文件 - Webpack 构建时若用了别名（如
@/components），sourcemap 中的路径可能是webpack:///./src/components/xxx.vue，这时需要配sourceMapPathOverrides做重映射，例如：{"webpack:///src/*": "${webRoot}/src/*"} - Node.js 调试不用
outFiles，改用resolveSourceMapLocations，比如："resolveSourceMapLocations": ["${workspaceFolder}/**", "!**/node_modules/**"]
最常被忽略的点是：sourcemap 不只是让断点生效，还负责变量名还原和作用域映射。如果调试时 hover 提示全是 undefined、参数名显示为 _a、this 指向混乱，问题不在 VSCode 配置，而在 sourcemap 生成质量——比如 Terser 开了 mangle 却没关 keep_fnames，或 Webpack devtool 选了 cheap-module-source-map 这种不带列信息的类型。
