每个前端项目都有 npm scripts,我们会用 npm scripts 来组织编译、打包、lint 等任务。
大家可能经常会跑 npm scripts,但却对这些命令行工具是怎么实现的并不了解。
那如果想了解这些工具的实现原理,应该怎么做呢?
这就是今天的主题:调试 npm scripts。
这些命令行工具的 package.json 里都会有个 bin 字段,来声明有哪些命令:
![](https://i-blog.csdnimg.cn/blog_migrate/bcb706620788495b48693469ab2f1f2b.png)
npm install 这个包以后,就会放到 node_modules/.bin 目录下:
![](https://i-blog.csdnimg.cn/blog_migrate/0d8e59d6a25cb94d1a5b2bcd7a36850b.png)
这样我们就可以通过 node ./node_modules/.bin/xx 来跑不同的工具了。
我们也可以用 npx 来跑,比如 npx xx,它的作用就是执行 node_modules/.bin 下的本地命令,如果没有的话会从 npm 下载然后执行。
当然,最常用的还是放到 npm scripts 里:
![](https://i-blog.csdnimg.cn/blog_migrate/0ae166f8edc907dd34f9547020797929.png)
这样就直接 npm run xxx 跑就行了。
npm scripts 本质上还是用 node 来跑这些 script 代码,所以调试他们和调试其他 node 代码没啥区别。
也就是可以这样跑:
在 .vscode/launch.json 的调试文件里,选择 node 的 launch program:
用 node 执行 node_modules/.bin 下的文件,传入参数即可: