VS Code调试配置关键是选对调试器并正确编写launch.json。需安装对应语言扩展,通过命令生成基础配置,理解type、request、program等字段,再按场景微调,最后验证排错。

VS Code 调试器配置其实不难,关键是根据项目类型选对调试器(Debugger),再写好 .vscode/launch.json 文件。只要理解几个核心字段,就能快速启动断点调试。
确认已安装对应调试扩展
VS Code 本身不内置语言运行时调试能力,需靠扩展支持:
- JavaScript/TypeScript:装 “Debugger for Chrome”(前端)或直接用内置 Node.js 调试(后端)
- Python:必须安装 “Python” 扩展(含调试器、linter、Jupyter 等)
- Go:安装 “Go” 扩展,并确保本地有
dlv(Delve)调试器 - C/C++:安装 “C/C++” 扩展,并配置好编译器(如 GCC/Clang)和
launch.json中的miDebuggerPath
生成基础 launch.json 配置
在项目根目录下,打开命令面板(Ctrl+Shift+P 或 Cmd+Shift+P),输入 “Debug: Open launch.json” → 选择环境(如 “Node.js”、“Python”、“Go”)→ VS Code 会自动生成模板。
常见关键字段说明:
大家都知道,在进行J2EE项目的开发过程中,在调试阶段如果只是修改了页面是不需要重启应用服务器的,比如不需要重启Tomcat。只需要在浏览器中 进行页面刷新即可。其实之所以不用重启Tomcat等应用服务器,其根本原因是因为我们可以在应用服务器的配置文件中设置虚拟目录,这样就可以知道web 项目所在的目录,于是就可以省去打包、然后再重新发布到服务器的步骤。感兴趣的朋友可以过来看看
-
“type”:调试器类型,如
node、python、go、cppdbg -
“request”:通常为
launch(启动程序)或attach(附加到已有进程) -
“program”:入口文件路径(如
"${workspaceFolder}/src/index.js") -
“args”:传给程序的命令行参数(数组格式,如
["--port", "3001"]) -
“env”:运行时环境变量(对象格式,如
{"NODE_ENV": "development"})
针对常见场景微调配置
不必从零手写,但要懂怎么改:
-
调试 TypeScript:确保已生成
js文件(通过tsc --watch或构建脚本),"program"指向编译后的.js文件,并设"sourceMaps": true -
调试 Python Flask/FastAPI:把
"module": "flask"或"module": "uvicorn",再加"args"如["app:app", "--reload"] -
调试带 Webpack 的前端:用
chrome类型配置,设置"url": "http://localhost:8080",并启用"webRoot"定位源码目录 -
远程调试(如 Docker/WSL):用
"request": "attach",配合端口映射和"port"/"address"字段连接调试服务
验证与排错小技巧
配置完别急着点 ▶️,先检查这几项:
- 终端里手动运行一次你的程序,确认能正常启动(避免调试器报错其实是代码本身问题)
- 在
launch.json里加"console": "integratedTerminal",方便看到输出和错误堆栈 - 如果断点灰了(未命中),检查是否启用了 source map、文件路径是否正确、是否在压缩/打包后代码上打点
- 打开调试控制台(Ctrl+Shift+Y),看有没有红色错误提示,比如 “Can’t find debug adapter” 说明扩展没装好
基本上就这些。配置一次,后续调试就顺了——比反复 console.log 高效得多。









