nodejs调试

使用Inspector调试Node.js程序

Inspector介绍

http://nodejs.cn/api/inspector.html

使用Inspector调试Node.js的优势

  • 可查看当前上下文的变量
  • 可观察当前函数调用堆栈
  • 不侵入代码
  • 可在暂停状态下执行指定代码
1
2
mkdir node-debug
code node-debug

在mac中使用vscode的命令code以及使用命令行在vscode中打开文件夹
image.png
使用command + shift + p,并输入shell,选择Shell Command:Install ‘code’ command in PATH,如上图。
完成后,即可使用vscode的命令行 code.

如何用code命令打开文件夹
1.在新窗口中打开文件夹
cd到需要打开的文件夹下,然后使用code -n .
上面指令中的-n 表示new window
2.在原窗口中打开文件夹
cd到需要打开的目录下,使用code -r .
上面指令中的-r表示 reuse window
至于code的其它命令,可以使用code -h查看和学习。

1
2
3
4
5
6
7
8
9
10
11
let v = 0;
function a(v) {
let v2 = 100;
v += v2;
}

function b() {
a(v);
}

b();

image.png

devtoolsFrontendUrl用于谷歌浏览器调试

Inspector的构成以及原理


###

激活调试

  • 如何激活调试
    1
    node --inspect app.js

image.png

因为代码执行完了,所以没有下文了

我们接下来弄一个可以一直看的

那用express弄一个
http://www.expressjs.com.cn/

image.png
例子有了

1
node app.js

关闭指定的端口号:
lsof -i:端口号
kill -9 6422
image.png

为什么node –inspect app.js 不能激活

image.png
**
这样设置后就好了

  • 激活调试后会发生什么
  1. Node进程通过WebSockets监听调试信息
  2. 启动一个HTTP服务,提供元信息
  • 如何调试没有激活的Node.js程序?

在Linux和OSX上,可以监听到SIGUSR1发送的调试信息

调试客户端

Chrome DevTools

  • 访问chrome://inspect 点击配置按钮,确保Host和Port对应

image.png

  • 访问元信息中的devtoolsFrontendUrl

  • 点击绿色小图标

image.png

调试客户端-Chrome devtools

image.png

调试客户端-vscode

  • 启动方式:按F5

这种方式适合简单的场景

  • 配置launch.json or “打开自动附加”

image.png
添加参数
image.png
后面在配置文件里面可以配置成
image.png
点击调试面板,两处任意一个都行,都可以开启调试
image.png
添加配置
image.png
image.png可以启动多个服务