NodeJS调试方法总结

Posted on   |   In   |     |  

一、 console.log

console.log 是最方便的，也是最快的，但是这种方法对于初学者来说肯定是不太适合的，接下来向下看

二、NodeJS内置调试器

使用方式：在控制台中输入以下命令：

1
node debug 脚本文件名

执行上面的命令结束之后，代码会自动停在脚本的第一行，等待用户执行其它调试命令。
如果你对相关命令不熟悉，那么可以通过输入 help 命令查看可用命令，代码显示如下

1
2
3
4
5
6
7
8
9
10
11
C:\Users\92816\Desktop\testprogramming>node debug a.js
< Debugger listening on port 5858
connecting to 127.0.0.1:5858 ... ok
break in C:\Users\92816\Desktop\testprogramming\a.js:1
> 1 "use strict";
  2 let foo = 'bar';
  3 console.log(foo);
debug> help
help
Commands: run (r), cont (c), next (n), step (s), out (o), backtrace (bt), setBreakpoint (sb), clearBreakpoint (cb),
watch, unwatch, watchers, repl, exec, restart, kill, list, scripts, breakOnException, breakpoints, version

如若想退出调试，则按上Ctrl+C按提示输入.exit即可。
这种方法也算中规中矩，但是可能对于经常习惯于浏览器调试的会感到不习惯，下面介绍带可视化界面的方法

三、 node-inspector

node-inspector 是一个第三方全局命令行调试工具。
node-inspector

3.1 安装

1
npm install -g node-inspector

3.2 启动调试

方法一，直接使用node-debug 文件名

1
node-debug a.js

node-debug 命令会自动在当前操作系统默认浏览器中加载node调试器,也就是说可以帮你自动打开你的默认浏览器，比较省心

1
2
3
4
5
6
C:\Users\92816\Desktop\testprogramming>node-debug a.js
Node Inspector v0.12.8
Visit http://127.0.0.1:8080/?port=5858 to start debugging.
Debugging `a.js`

Debugger listening on port 5858

方法二，使用node –debug-brk 文件名再结合上node-inspector

先打开一个命令行窗口可以输入下面的命令启动调试：

1
node --debug-brk a.js

会显示如下

1
2
C:\Users\92816\Desktop\test>node --debug-brk a.js
Debugger listening on port 5858

接下来在另外打开一个命令行窗口输入node-inspector,出现下面的提示，将http://127.0.0.1:8080/?port=5858复制到你的浏览器地址栏即可开始调试了

1
2
3
C:\Users\92816\Desktop\test>node-inspector
Node Inspector v0.12.8
Visit http://127.0.0.1:8080/?port=5858 to start debugging.

调试的快捷键和在 Chrome 浏览器中的快捷键是一样的,在这里就不多说了

四、 visual studio code 调试 node

这一款工具我个人觉得还是很好用的，界面做的也是非常不错的，推荐使用

visuao studio code 官方网站

4.1 下载

visuao studio code 下载地址

4.2 安装

手动安装，一直下一步下一步就可以了

4.3 开始调试

vsc官方文档调试链接

  1. 必须以项目的方式打开要调试的js脚本所在的目录，目录路径最好不要包含中文，否则可能有问题
  2. 在要调试的脚本文件中，找到具体要设置断点的行，在左侧点击设置断点
  3. 设置好断点之后，按F5启动调试
  4. 这个时候，vsc 编辑器会提示你选择要调试的环境，这里选择 Node.js 即可
  5. 当选择完调试环境之后，vsc 默认会在当前根目录下生成一个 .vsccode 目录
  6. 在 .vsccode 目录下找到一个叫做 launch.json 的文件，打开编辑
  7. 在 launch.json 文件中，在 configurations 节点下找到一个叫做 program 的属性节点
  8. 将 program 属性节点中原来的值 ${workspaceRoot}/app.js 改为 ${workspaceRoot}/要调试的脚本文件名.js
  9. 修改完毕之后，按 Ctrl+C 保存
    1. 上述操作完成之后，按 F5 启动调试
  11. 尽情的享受 vsc 调试带给你的调试的乐趣吧
  12. 快捷键和 Chrome 浏览器中的调试环境快捷键一致

对于执行了以上操作还没有成功的，建议将 vsc 关闭重新打开再次按 F5 启动调试即可解决，如果有快捷键冲突的时候，可以使用fn+F5

五、 Webstorm 调试 (IDE方式）

按以下几步调试即可，相对来说也比较简单，就是可能比较重量级一些，喜欢轻量级的可以考虑使用visuao studio code;

5.1 开始调试

  1. 在要调试的文件中具体的行位置左边通过 Ctrl+F8 设置一个端点
  2. 在当前要调试的文件中通过鼠标右键，然后选择 Debug 要调试的文件名.js
  3. 这个时候 ws 会自动帮你启动调试模式，并且自动停留在你打击端点的位置
  4. F8 步进
  5. Shift + F8 步出
  6. Alt + F8 可以执行一个表达式
  7. Ctrl + F5 重新启动调试

结语

    这里也只是总结了五种调试方式，怎么说呢，工具肯定会有很多，我觉得最重要的是找到最适合自己的，有句话，适合自己的就是最好的！