vscode调试支持条件断点、日志点、异常断点、“仅我的代码”模式及调试控制台动态执行。条件断点按布尔表达式触发;日志点输出信息不中断执行;异常断点捕获指定错误;skipFiles 跳过第三方代码;调试控制台可实时求值与修改变量。

如果您在使用 VSCode 进行代码调试时希望精准控制断点触发时机、避免打断执行流或直接观察变量行为,则可能需要借助条件断点、日志点与异常捕获等高级功能。以下是实现这些功能的具体操作方式:
本文运行环境:MacBook Air,macos Sequoia。
一、设置条件断点
条件断点允许您仅在特定表达式为真时暂停程序执行,适用于 循环 中只关注某次迭代、或仅当某变量达到阈值时调试的场景。
1、在代码行号左侧灰色区域单击,设置普通断点。
2、右键点击已设置的断点红点,选择 Edit Breakpoint。
3、在弹出的输入框中输入布尔表达式,例如 i === 5 或 user.id > 100。
4、按下回车确认,断点图标将变为橙色三角形加感叹号标识。
二、插入日志点(Logpoint)
日志点不中断执行,仅向调试控制台输出指定内容,适合监控高频调用函数中的变量状态,同时保持程序流畅运行。
1、在目标代码行左侧灰色区域按住 Ctrl 键(windows/linux)或 Cmd 键(macOS),再单击设置断点。
2、右键点击该断点,选择 Edit Breakpoint。
3、在输入框中输入要打印的 字符串,支持模板语法,例如 “User: ${user.name}, Status: ${user.active}”。
4、保存后,该行执行时将在调试控制台输出对应信息,且程序不会暂停。
三、配置异常断点
异常断点可在 javaScript/typescript 抛出未捕获异常或特定类型异常(如 ReferenceError、TypeError)时立即中断,便于定位异常源头。
1、打开调试视图(Ctrl+Shift+D 或 Cmd+Shift+D)。
2、点击调试面板顶部的 Breakpoints 部分下方的 +(加号) 图标。
3、从下拉菜单中选择 javascript Exception Breakpoint。
4、勾选 All Exceptions 启用全局异常中断,或展开后单独勾选 Uncaught Exceptions 及具体异常类型。
四、启用“仅我的代码”模式
该模式可自动跳过 node_modules 和系统库中的代码,使调试焦点始终停留在项目源码内,避免误入第三方模块内部。
1、在启动调试前,打开 .vscode/launch.json 文件。
2、在对应配置的 configurations 对象 中添加字段:“skipFiles”: [“
3、保存文件并重启调试会话,F11 单步进入时将不再进入内置模块。
五、使用调试控制台执行动态表达式
调试控制台支持在暂停状态下实时求值、修改变量、调用函数,是验证逻辑与快速修复的高效入口。
1、程序在断点处暂停后,确保焦点位于调试控制台(Ctrl+Shift+Y 或 Cmd+Shift+Y)。
2、输入任意合法表达式,例如 document.querySelector(‘input’).value 或 arr.filter(x => x > 10)。
3、按回车执行,结果将立即显示在控制台中。
4、若需修改变量,可直接输入赋值语句,例如 count = 0,后续继续执行将使用新值。