很多人都是用 console.log 调试的,哪怕工作很多年依然是这样,这样有个致命的缺点:
你只能看到某个点的变量值,而看不到代码的整个执行路线。
对于复杂的项目来说,会用断点调试是必须的,因为这样可以看到作用域、调用栈,也就是代码的执行路线,然后单步运行来看变量的变化。
所以这一节来学下如何调试 nest 项目。
首先,先看下 node 调试,创建个项目:
mkdir debug-test
cd debug-test
npm init -y
添加 index.js:
const os = require('os');
const homedir = os.homedir();
console.log(homedir);
通过 os 模块拿到了 home 目录的路径。
直接执行node index.js会输出结果。我们以调试模式跑起来:
node --inspect-brk index.js
--inspect 是调试模式运行,而 --inspect-brk 还会在首行断住。
可以看到,它起了一个 ws 服务。
然后我们用调试客户端连上它,比如用 Chrome DevTools。
浏览器地址栏输入 chrome://inspect/,可以看到可以调试的目标:
如果没有,就配置下 network target,加上 localhost:9229
点击 inspect 就可以看到调试界面了:
代码在首行断住了,右侧也可以看到作用域和调用栈。
nest 也是 node 项目,自然也是这样来调试的。
nest start 有个 --debug 的选项,
原理就是 node --inspect。
这时候 inspect 发现啥也没:
因为 --inspect 并不会和 --inspect-brk 一样在首行断住。
我们在 controller 里加个 debugger:
然后访问下 http://localhost:3000
这时候你会发现代码在断点处断住了:
这样,就可以调试 nest 项目了。
但是这样调试还是太麻烦,我们一般在 VSCode 里写代码,能不能直接在 VSCode 里边写代码边调试呢?
当然是可以的。VSCode 也实现了 Debugger 的客户端。
点击调试面板的 create launch.json file,它会创建 .vscode/launch.json 的调试配置文件,然后输入 node,快速创建一个 node 调试配置:
我们先调试下前面那个 index.js 文件:
stopOnEntry 是在首行断住,和 --inspect-brk 一样的效果。
这样,就可以在 vscode 里调试 node 代码了。在 vscode 里调试代码,最爽的是可以边改代码边调试。
比如你调试的过程中修改了代码,然后点击重新调试,就可以马上看到改动之后的效果。
nest 自然也可以这样调试:
还是 nest start --debug 来启动 nest 服务, --debug 就是以调试模式启动进行,它就会开启一个ws服务,端口是9229,这样调试器才能连到这个服务上。
添加一个 attach 类型的调试配置:
然后在 controller 里打个断点,访问 http://localhost:3000, 代码同样会在断点处断住。
这样就可以直接在 vscode 里打断点了。
不过如果是用 VSCode 调试,可以不用 nest start --debug,有更简便的方式:
创建 npm scripts 的调试配置:
(如果创建出的调试配置 type 是 pwa-node 也可以,和 node 类型差不多,据说 pwa-node 功能多一点)
{
"type": "node",
"request": "launch",
"name": "debug nest",
"runtimeExecutable": "npm",
"args": [
"run",
"start:dev",
],
"skipFiles": [
"<node_internals>/**"
],
"console": "integratedTerminal",
}
和我们命令行执行 npm run start:dev 一样。
这里的 runtimeExecutable 代表执行什么命令,args 传参数。
要指定 console 为 integratedTerminal,也就是用 vscode 的内置终端来打印日志,不然默认会用 debug console 跑,那个没有颜色。
点击调试模式启动: