千家信息网

vscode npm如何执行

发表于:2024-11-20 作者:千家信息网编辑
千家信息网最后更新 2024年11月20日,这篇文章给大家分享的是有关vscode npm如何执行的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。vscode npm怎么执行?vscode 调试node之npm与nod
千家信息网最后更新 2024年11月20日vscode npm如何执行

这篇文章给大家分享的是有关vscode npm如何执行的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。

vscode npm怎么执行?

vscode 调试node之npm与nodemon

调试nodejs有很多方式,可以看这一篇How to Debug Node.js with the Best Tools Available,其中我最喜欢使用的还是V8 Inspector和vscode的方式。

在vscode中,点击那个蜘蛛的按钮

就能看出现debug的侧栏,接下来添加配置

选择环境

就能看到launch.json的文件了。

启动的时候,选择相应的配置,然后点击指向右侧的绿色三角

launch模式与attach模式

{  "version": "0.2.0",  "configurations": [    {      "type": "node",      "request": "launch",      "name": "Launch Program",      "program": "${workspaceRoot}/index.js"    },    {      "type": "node",      "request": "attach",      "name": "Attach to Port",      "address": "localhost",      "port": 5858    }  ]}

当request为launch时,就是launch模式了,这是程序是从vscode这里启动的,如果是在调试那将一直处于调试的模式。而attach模式,是连接已经启动的服务。比如你已经在外面将项目启动,突然需要调试,不需要关掉已经启动的项目再去vscode中重新启动,只要以attach的模式启动,vscode可以连接到已经启动的服务。当调试结束了,断开连接就好,明显比launch更方便一点。

在debug中使用npm启动

很多时候我们将很长的启动命令及配置写在了package.json的scripts中,比如

"scripts": {  "start": "NODE_ENV=production PORT=8080 babel-node ./bin/www",  "dev": "nodemon --inspect --exec babel-node --presets env ./bin/www"},

我们希望让vscode使用npm的方式启动并调试,这就需要如下的配置

{  "name": "Launch via NPM",  "type": "node",  "request": "launch",  "runtimeExecutable": "npm",  "runtimeArgs": [    "run-script", "dev"//这里的dev就对应package.json中的scripts中的dev  ],    "port": 9229//这个端口是调试的端口,不是项目启动的端口},

在debug中使用nodemon启动

仅仅使用npm启动,虽然在dev命令中使用了nodemon,程序也可以正常的重启,可重启了之后,调试就断开了。所以需要让vscode去使用nodemon启动项目。

{  "type": "node",  "request": "launch",  "name": "nodemon",  "runtimeExecutable": "nodemon",  "args": ["${workspaceRoot}/bin/www"],  "restart": true,  "protocol": "inspector",//相当于--inspect了  "sourceMaps": true,  "console": "integratedTerminal",  "internalConsoleOptions": "neverOpen",  "runtimeArgs": [//对应nodemon --inspect之后除了启动文件之外的其他配置    "--exec",    "babel-node",    "--presets",    "env"  ]},

注意这里的runtimeArgs,如果这些配置是写在package.json中的话,就是这样的

nodemon --inspect --exec babel-node --presets env ./bin/www

这样就很方便了,项目可以正常的重启,每次重启一样会开启调试功能。

可是,我们并不想时刻开启调试功能怎么办?

这就需要使用上面说的attach模式了。

使用如下的命令正常的启动项目

nodemon --inspect --exec babel-node --presets env ./bin/www

当我们想要调试的时候,在vscode的debug中运行如下的配置

{  "type": "node",  "request": "attach",  "name": "Attach to node",  "restart": true,  "port": 9229}

完美!

感谢各位的阅读!关于"vscode npm如何执行"这篇文章就分享到这里了,希望以上内容可以对大家有一定的帮助,让大家可以学到更多知识,如果觉得文章不错,可以把它分享出去让更多的人看到吧!

0