最近被webstorm搞的只能和他說(shuō)再見了，下面就說(shuō)一下nodemon怎么在vscode中調(diào)試
2020-01-19更新：
如果vscode的launch.json不配置port的話坠陈，nodemon啟動(dòng)時(shí)會(huì)默認(rèn)使用--inspect-brk參數(shù)，這個(gè)參數(shù)可以指定使用chrome調(diào)試時(shí)的Pid仇矾。
在使用typecript時(shí)我們需要先使用tsc編譯解总，再啟動(dòng)，樓主嘗試直接在nodemon.json里配置
"execMap": {
"js": "npm run start"
}
時(shí)花枫，日志會(huì)打出以npm run start --inspect-brk=pid ./dist/app.js的日志掏膏，實(shí)際上我們期望的是工程以node --inspect-brk=pid ./dist/app.js 方式啟動(dòng)隙疚，因?yàn)檫@樣vscode的調(diào)試系統(tǒng)才能獲取Chrome DevTools并斷點(diǎn)調(diào)試，為了解決這個(gè)問題供屉，筆者想了個(gè)辦法
在工程的bin目錄下增加dev.sh內(nèi)容如下
npm run prestart #先編譯
node $1 ./dist/app.js #因?yàn)閚odemon啟動(dòng)時(shí)默認(rèn)帶了--inspect-brk參數(shù)溺蕉，此時(shí)獲取該參數(shù)并啟動(dòng)可以實(shí)現(xiàn)pid的Attachs
然后修改nodemon.json如下
nodemon.json
{
"restartable": "rs",
"ignore": [
".git",
"node_modules/**/node_modules"
],
"verbose": true,
"execMap": {
// "js": "npm run start"
"js": "./bin/dev.sh" // 改為dev.sh啟動(dòng)
},
"watch": [
"src/"
],
"ext": "ts,js,json"
}
// 采用vscode默認(rèn)配置
{
"type": "node",
"request": "launch",
"name": "nodemon",
"runtimeExecutable": "nodemon",
"program": "${workspaceFolder}/dist/app.js",
"restart": true,
"console": "integratedTerminal",
"internalConsoleOptions": "neverOpen",
"skipFiles": [
"<node_internals>/**"
],
"sourceMaps": true,
"outFiles": [
"${workspaceFolder}/dist/**/*.js"
],
"cwd": "${workspaceFolder}",
"timeout": 25000
}
搞定！
以下方法是在意識(shí)到上述問題之前采用的手段疯特，也可以用，只是要操作兩下：先npm run debug(其實(shí)就是用nodemon啟動(dòng)工程)录别，然后再Attach nodemon啟動(dòng)的線程邻吞，一開始對(duì)vscode的這個(gè)Attach很是困惑组题，后來(lái)查了下Attach這個(gè)單詞的意思：把…固定抱冷，把…附(在…上); 應(yīng)該不用多說(shuō)了吧。
第一步：debug->Add configuration
如圖右下角Add configration可以自己定義配置
也可以復(fù)制我的
{
"type": "node",
"request": "attach",
"name": "Attach by Process ID",
"processId": "${command:PickProcess}",
"skipFiles": [
"<node_internals>/**"
],
"protocol": "inspector",
"restart": true,
}
在package.json中加入script
"debug": "nodemon"
第二步：如何調(diào)試赵讯？
npm run debug
然后點(diǎn)擊那只蟲子
單步調(diào)試一下耿眉，OK了。
