当前位置: 首页 > news >正文

VS Code调试Node.js核心 打断点 → F5 → 单步执行 + 看变量 - jerry

下面我用最常见、最实用的方式,带你一步步在 VS Code 调试 Node.js 代码(适合前端 / Node 开发日常用)。


一、最简单方式(推荐新手):直接调试当前 JS 文件

1️⃣ 准备一个 Node 文件

// index.js
function add(a, b) {return a + b;
}const result = add(2, 3);
console.log(result);

2️⃣ 在 VS Code 中打断点

  • 打开 index.js

  • 在行号左侧 点一下(出现红点)
    👉 这就是断点


3️⃣ 启动调试

两种方式任选:

  • 右上角 ▶️ Run

  • 或快捷键

    • macOS:F5

    • Windows:F5

👉 VS Code 会自动识别 Node.js,并启动调试


4️⃣ 常用调试操作

操作按键
继续执行 F5
单步跳过(Step Over) F10
进入函数(Step Into) F11
跳出函数(Step Out) Shift + F11
停止 Shift + F5

二、标准方式:使用 launch.json(真实项目必备)

1️⃣ 打开调试配置

  • 左侧点 Run and Debug

  • 点击 create a launch.json

  • 选择 Node.js


2️⃣ 最常见配置(Node 项目)

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

📌 说明:

  • program:入口文件

  • cwd:工作目录

  • skipFiles:跳过 Node 内部代码(很重要)


三、调试 npm scripts(非常常用)

package.json

{"scripts": {"dev": "node src/app.js"}
}

对应的 launch.json

{"type": "node","request": "launch","name": "Debug npm run dev","runtimeExecutable": "npm","runtimeArgs": ["run", "dev"],"console": "integratedTerminal","skipFiles": ["<node_internals>/**"]
}

👉 调试真实项目 80% 都用这个


四、Attach 模式(调试已运行的 Node 进程)

1️⃣ 用 inspect 启动 Node

node --inspect index.js

或:

node --inspect-brk index.js

2️⃣ VS Code attach 配置

{"type": "node","request": "attach","name": "Attach Node","port": 9229,"skipFiles": ["<node_internals>/**"]
}

📌 适合:

  • 服务已经在跑

  • Docker / 远程服务

  • 线上问题复现


五、调试 Express / Koa(后端必会)

示例:Express

app.get('/test', (req, res) => {debugger; // 也可以直接写res.send('ok');
});

📌 访问接口时会自动断下


六、调试技巧(很重要)

✅ 1️⃣ debugger 关键字

debugger;

执行到这里 自动断点


✅ 2️⃣ 变量监控(Watch)

  • 左侧 Watch

  • 输入变量名或表达式

req.body
user.id

✅ 3️⃣ 条件断点

  • 右键断点 → Add Conditional Breakpoint

id === 1001

✅ 4️⃣ 调试 TS(Node + TS)

关键点:

  • 要有 sourceMap: true

  • 断点打在 .ts


七、最常见问题排查

❌ 断点不生效

✔ 检查:

  • 是否是编译后的代码(dist)

  • program 是否正确

  • 是否开启 source map


❌ 一直进 Node 内部源码

✔ 加上:

"skipFiles": ["<node_internals>/**"]

八、一句话总结(记这个就够)

VS Code 调试 Node.js 的核心就是:打断点 → F5 → 单步执行 + 看变量。

http://www.zskr.cn/news/183360.html

相关文章:

  • 详细解析 SYN泛洪
  • 如何根据年龄选择适合的近视防控方法?科学分龄,精准防控!
  • Java毕设项目:基于SpringBoot的汽车配件仓储管理系统设计与实现(源码+文档,讲解、调试运行,定制等)
  • 性价比高的循环水处理口碑好的公司
  • 军用车辆检测数据集介绍-2274张图片 军事侦察监控 卫星图像分析 边境安全防护 军事装备管理 战场态势感知 安全威胁评估
  • 理解机器学习里的NFL定理
  • 进程,动态库,COM机制关系概述
  • 降AI率不靠硬改,前五工具更省事
  • 使用illustrator的套索工具提取元素
  • 【毕业设计】基于SpringBoot的汽车配件仓储管理系统设计与实现(源码+文档+远程调试,全bao定制等)
  • CSDN年度技术趋势预测
  • 去掉手写字上面的表格线
  • 读书笔记9-12.18
  • 计算机Java毕设实战-基于SpringBoot的学校图书管理系统设计与实现基于Vue和SpringBoot的图书管理系统【完整源码+LW+部署说明+演示视频,全bao一条龙等】
  • 不用额外花时间!眼调节训练灯,破解儿童近视度数递增难题
  • LangGraph MultiAgent 智能书籍写作系统
  • 调节力的秘密!你知道吗?调节力在日常生活中非常重要
  • 官网-中华人民共和国个人所得税法
  • [Quicker] 蓝奏云API - 源码归档
  • 亚马逊卖家站外引流:猎豹移动与主流Meta广告代理商服务选型参考 - 智造出海
  • 2025辽宁最新汽车装饰品牌top5推荐!沈阳等地区高品质服务厂商权威榜单发布,赋能汽车后市场新生态 - 全局中转站
  • 安装包依赖混乱?Miniconda-Python3.10锁定版本一劳永逸
  • 读书笔记8-12.11
  • 计算机Java毕设实战-基于Spring Boot的四季鲜蔬果园电商平台设计与实现基于SpringBoot的“鲜蔬坊”蔬菜销售平台【完整源码+LW+部署说明+演示视频,全bao一条龙等】
  • 【课程设计/毕业设计】基于springboot的水果蔬菜生鲜商城系统基于SpringBoot的“鲜蔬坊”蔬菜销售平台【附源码、数据库、万字文档】
  • 什么叫癌症里面的biomarker、分子病理学
  • 遥控器的秘密你知道吗?
  • SW 随笔 006 — C# 模式匹配,豪华的布尔表达式
  • AI原生应用领域多轮对话的安全性保障措施
  • 免Root卸载电视预装软件:ADBTV电视端ADB工具详解与使用指南