VS Code调试Node.js后端调试器未触发 配置无法启动Chrome

你当前配置的是Chrome浏览器端调试规则，仅能调试运行在浏览器里的前端代码，根本不支持Node.js后端进程的调试，所以调试器完全不会触发后端断点。

• 先确认VS Code已启用内置的JavaScript Debugger扩展，在扩展面板搜索该名称确认状态为已启用即可，不需要额外安装第三方调试插件。
• 打开项目根目录下.vscode/launch.json文件，删除原有错误的Chrome调试配置，根据你的后端启动方式二选一替换配置：
  1. 直接通过node命令启动入口文件的场景，用如下配置，记得把program字段的值换成你项目实际的后端入口文件路径，常见的入口文件为index.js/app.js/server.js：

{
  "version": "0.2.0",
  "configurations": [
    {
      "name": "调试Node后端",
      "type": "node",
      "request": "launch",
      "program": "${workspaceFolder}/index.js",
      "skipFiles": ["<node_internals>/**"],
      "console": "integratedTerminal"
    }
  ]
}

2. 通过npm脚本启动后端的场景（比如执行npm run dev/npm start启动），用如下配置，把runtimeArgs里的脚本名换成你package.json中定义的实际启动命令名即可：

{
  "version": "0.2.0",
  "configurations": [
    {
      "name": "通过NPM脚本调试Node后端",
      "type": "node",
      "request": "launch",
      "runtimeExecutable": "npm",
      "runtimeArgs": ["run", "dev"],
      "skipFiles": ["<node_internals>/**"],
      "console": "integratedTerminal"
    }
  ]
}

配置完成后按F5即可启动后端调试：

• 在接口响应处理逻辑对应的代码行号左侧点击，打上红色断点，当接口收到请求执行到断点位置时会自动暂停
• 左侧调试面板的「变量」区域可以直接查看当前作用域下所有请求、响应对象的完整内容
• 也可以把需要重点关注的响应字段添加到「监视」列表，实时追踪值的变化，在调试控制台也可以直接输入变量名即时打印内容。

如果需要同时联调前端页面，可以在配置数组里追加你之前写的Chrome调试规则，再添加compound复合启动配置同时拉起后端和Chrome调试即可，单独调试后端不需要Chrome相关配置。

内容的提问来源于stack exchange，提问作者Alish Madhukar