如何 debug nodeJS 代码? how to inspect NodeJS code?

Posted 2021-02-14 givingwu

基本原理

1. 启动 WebSocket 进行基于 inspect protocol 双工通信
   1. current_node_process <=> current_websocket <=> current_inspect_tool
2. 启动 HTTP 服务，记录源(Meta)信息
3. 每个程序会生成一个 UUID

IDE

VS Code

VS code 中打断点，然后进入 debugger 面板，点击开始。

Config launch.json

mkdir node-debug-demo
cd node-debug-demo
touch cmd.js
echo "console.log(process.argv.slice(2))" >> cmd.js
node cmd.js -t test -a abort

Will show folling results:

[ '-t',
  'test',
  '-a',
  'abort' ]

But may they never been show for VS code debug mode, so we need canfig the .vscode/launch.json:

Then we could see this:

We could write manaul or auto generate new:

Code:

{
  "type": "node",
  "request": "launch",
  "name": "Test cmd.js",
  "program": "${workspaceFolder}/cmd.js",
  "args": [
    "-t",
    "test",
    "-a",
    "abort"
  ]
}

Use VS code debug panel to debug the cmd.js before this we must chekcout to it:

Chrome DEVTOOLS

chrome://inspect

1st: Run CMD in terminal and the CLI options are right here:

node debug -help # it is very useful as well
# or 
node inspect dmeo.js

> help

2nd: Navigates to chrome://inspect page

inspect protocol

1st: Run CMD in terminal and the CLI options are right here:

复制 HOST + PORT 端口号进入浏览器：

HOST + PORT + "/json" 查看 HTTP

复制返回的 JSON 字符串中的 devtoolsFrontendUrl 字段，打上 breakpoint, 开始调试：

DEVTOOLS Node ICON

only works for OSX and Linux.
点击绿色的 nodeJS ICON.

性能调优

open DEVTOOLS - JSProfiler recording, then refresh current page to record how long used of each function execute.

END

Have fun with NodeJS.