写完代码，加好断点，按F5一跑——断点直接被跳过，光标飞快往下走，调试窗口里连个影子都看不到。别急着怀疑VS或Chrome出了问题，先看看是不是这几个地方卡住了。
1. 代码根本没执行到那行
最常见也最容易被忽略：你打的断点在 if(false) 里、在 never-called 的函数里，或者压根被 return 提前拦住了。比如：
function loadData() {
if (!user.isLoggedIn) return; // 断点打在这行后面？永远进不去
console.log('开始加载'); // 断点打在这？也不会停
}打开开发者工具，点「Sources」→ 右键断点行 → 「Break on caught exceptions」关掉（避免误触发），再确认当前分支逻辑是否真会走到这里。
2. 源码映射（Source Map）没对上
用 Vue/React/Vite 打包后，浏览器跑的是 dist 里的压缩 JS，但你在 .vue 或 .tsx 里打的断点，靠的是 source map 映射。如果 map 文件缺失、路径错位、或构建时没开启 sourceMap，断点就只能干瞪眼。
检查方法：在 Chrome DevTools 的 Sources 面板里，展开左侧文件树，找找有没有「webpack://」或「src/」开头的真实源码。没有？那就去 vite.config.ts 或 vue.config.js 里确认：build.sourcemap: true 是否已开启。
3. 断点被禁用了或处于“未绑定”状态
Chrome 里右键断点 → 看看有没有勾选「Disable breakpoint」；VS Code 左侧断点栏里，灰色圆点表示断点未激活，鼠标悬停会提示「Unbound breakpoint」。常见原因有：
- 文件保存后没重新加载（尤其用 Live Server 时，改完 JS 忘了刷新页面）；
- 调试器连的是旧版本 HTML，引用的 JS 还是缓存里的；
- 用了 import() 动态导入，模块还没加载完成，断点就提前挂上了。
4. 浏览器或编辑器开启了“忽略列表”
VS Code 默认会把 node_modules、dist、lib 这些目录加入「自动忽略」。如果你在本地 npm link 的包里打断点，或者调试一个内联的第三方 SDK，就得手动删掉忽略规则。
打开 VS Code 设置 → 搜索「debug.javascript.autoAttachFilter」和「debug.javascript.ignore」，把干扰项清掉。Chrome 同理：DevTools → Settings → «Blackboxing» → 把勾选的正则全取消，尤其是 .*node_modules.* 这类。
5. 异步代码 + 断点位置太“急”
比如在 setTimeout 或 Promise.then 里打的断点，如果 JS 主线程早就跑完了，而你又没开「Async stack traces」，断点可能一闪而过。试试在 Chrome 的 Debugger 面板左上角勾选「Async」，或在 VS Code 的 launch.json 里加上：
{
"type": "pwa-chrome",
"request": "launch",
"url": "http://localhost:3000",
"webRoot": "${workspaceFolder}/src",
"sourceMaps": true,
"smartStep": true
}其中 smartStep: true 能帮调试器自动跳过编译生成的无关代码，更稳地停在你写的逻辑上。
下次再遇到断点跳过，不用重启电脑，也不用重装插件。先盯三秒：这行代码现在到底会不会运行？源码和浏览器里看到的是不是同一份？断点图标亮不亮？慢慢排查，比盲猜快得多。