Logpoint 能输出变量且不暂停,但必须是橙色菱形图标、运行在调试会话中、sourceMap 正确启用——三者缺一不可;否则退化为红色实心断点导致程序卡住。

Logpoint 能输出变量且不暂停,但必须是橙色菱形图标、运行在调试会话中、sourceMap 正确启用——三者缺一不可;否则它就退化成红色实心断点,程序直接卡住。
怎么确认你加的真是 Logpoint 而不是普通断点
VSCode 行号左侧的图标决定行为:实心红点 = 暂停执行;橙色菱形 + 号 = 只打印、不暂停。右键菜单里选 Add Log Point… 才生成后者;左键单击默认是前者。快捷键更可靠:Alt + Click(Windows/Linux)或 Option + Click(macOS)直接把红点转成橙色菱形,绕过 UI 权限判断。
常见错误现象:
- Debugger paused 弹窗反复出现 → 实际是普通断点没删干净
- 接口响应变慢、动画卡顿 → 高频行(如
render()或循环体)误设了普通断点 -
Debug Console无输出 → 图标看着像 Logpoint,但其实是未验证断点(unverified breakpoint),常因launch.json中program路径错或sourceMap未启用
Logpoint 表达式能写什么、不能写什么
Logpoint 的表达式在调试器上下文中求值,不是 JS 运行时执行,所以它安全但受限:
- ✅ 支持:
user.id、`status: ${res.status}`、JSON.stringify(data)、arr.length - ❌ 不支持:
getData()(函数调用会被忽略)、let x = 1(声明语句报错)、this.state(若当前作用域无this则undefined) - ⚠️ 注意:模板字符串中插值只对已存在变量生效;
${notDeclared}会输出undefined,不会报错但可能误导
为什么 Logpoint 有时根本不输出日志
Logpoint 是调试器能力,不是编辑器功能——它必须依赖正在运行的调试会话才能激活:
- 必须先启动调试(
Ctrl+Shift+D→ 点绿色三角形),不能靠Ctrl+F5(运行而不调试) - Node.js 项目需确保
launch.json中type为"node",且program指向真实入口(如"${workspaceFolder}/src/index.ts") - TypeScript 项目必须开启
sourceMap:编译选项含"sourceMap": true,且launch.json中建议显式配"sourceMaps": true - Chrome 调试需启动时带
--remote-debugging-port=9222,否则 Logpoint 降级为普通断点
Logpoint 和 console.log 的本质区别在哪
Logpoint 是调试器注入的日志指令,不是 JS 运行时语句:
-
console.log是运行时行为:会执行表达式、可能有副作用(比如调用getData())、影响性能,且必须手动增删 - Logpoint 是调试器行为:仅在 VSCode 的 Debug Adapter 层解析并输出,表达式在调试上下文中求值,但程序线程不中断、不跳栈、不卡帧
- 它不修改源码、不污染构建产物、不触发重载,也不会因忘记删除而上线
高频循环里加 Logpoint 看起来很轻量,但每次仍要序列化变量并传给调试器——真正在意性能时,得留意实际吞吐下降,尤其在 requestAnimationFrame 或密集轮询路径中。


















