用vscode寫過Node這類項目的小伙伴們都知道, 如果我們想要排查問題的時候大部分都是通過console.log進行打印來看問題在哪, 如果涉及到的問題比較復雜的時候會選擇通過Vscode中debug來調試嘗試解決, 可如果是Nest項目的話, 除了配置launch.json的話, 在調試的時候可能會提示 找不到任務“tsc: build – tsconfig.json”。
package.json
首先在package.json的script腳本中配置命令來優化, 這樣不需要每次都在終端敲那么長的命令。【推薦學習：vscode教程、vscode教程】
{ "scripts": { "start":"nest start", "dev:debug": "pnpm run start:debug", "start:debug": "nest start --debug --watch", }}復制代碼
我們通過運行pnpm run dev:debug 就可以在運行在使用nest命令運行項目的時候添加`—debug“參數來進行調試, 但是這個時候我們只是把項目運行起來了, 在VSCode中打斷點的時候并不會斷住, Debug面板中也沒有運行
Attach 調試
- 打開命令面板（command+shift+p)，搜索Toggle Auto Attach，選中后回車啟用
- 選擇總是: 這樣只要在終端通過nodejs運行任務的時候都會啟動一個ws的調試端口
這個時候通過, 終端會出現下面這行,接著訪問vscode教程, 就可以看到VSCode運行的每個調試用的wb(wbsocket), VScode調試本質上就是通過雙端通信的方式進行調試
Debugger listening on ws://127.0.0.1:9229/8e908307-94a7-4513-a525-82953b2c02c7For help, see: https://nodejs.org/en/docs/inspector復制代碼
launch.json
現在我們可以通過本配置lunch.json的調試方式為attach來進行調試剛剛VScode提供的調試進程
{ "version": "0.2.0", "configurations": [ { "type": "node", // 調試方式改為附加 "request": "attach", "name": "Attach Nest", "skipFiles": [ "<node_internals>/**" ], // 啟動調試器之前運行任務進行編譯TS項目 "preLaunchTask": "npm: dev:debug", "outFiles": [ "${workspaceFolder}/dist/**/*.js" ] } ] }復制代碼
注意preLaunchTask, 上面我們說到在啟動調試的時候會提示會提示 **找不到任務“xxx tsconfig.json”。**我們需要在調試先通過tsc 編譯
tasks.json
在VS Code中通過 tasks 配置文件，可以定義一組任務以便在編輯器中執行。
{ "version": "2.0.0", "tasks": [ { "type": "typescript", "tsconfig": "tsconfig.json", "problemMatcher": [ "$tsc" ], "group": "build", "label": "tsc: build", "options": { "emit": "true", "pretty": "true", } }, { "type": "npm", "script": "dev:debug", "problemMatcher": [], "label": "npm: dev:debug", "detail": "pnpm run start:debug", "dependsOn": [ "tsc: build" ] } ] }復制代碼
下面解釋下上面配置的兩個任務
- tsc: build: TypeScript 編譯任務，它使用 tsconfig.json 文件中的配置來編譯 TypeScript 代碼。任務的類型為 typescript，所以它會使用 tsc 命令來執行編譯。在編譯期間，如果有任何錯誤，則會使用 $tsc 問題匹配器來識別錯誤信息。
- npm: dev:debug: 運行 NestJS 應用程序的調試任務。它的類型是 npm，可以使用 NPM、Yarn 或 PNPM 來運行腳本。該任務執行 dev:debug 腳本，該腳本由 NestJS 應用程序開發人員定義，并在 package.json 文件中指定。該任務的依賴關系是 tsc: build，這意味著在運行 npm: dev:debug 任務之前，需要先執行 tsc: build 任務來編譯 TypeScript 代碼。
至此我們就可以通過在VScode面板點擊調試按鈕, 運行npm: dev:debug 任務使用編譯后的 JavaScript 代碼來啟動 NestJS 應用程序的調試版本。通過這種方式，可以在 VS Code 中輕松地執行構建和調試操作，并使用一個簡單的命令來啟動整個過程。
更多關于VSCode的相關知識，請訪問：vscode教程！
