老呂教程--02後端KOA2框架自動重啟編譯服務(nodemon)
阿新 • • 發佈:2020-12-26
上一篇講完搭建Typescritp版的Koa框架後,F5執行服務端,頁面進行正常顯示服務。
今天要分享的是,如果要修改服務端程式碼,如果讓編譯服務自動重啟,免去手動結束服務再重啟的過程。
自動重啟服務需要使用nodemon工具。nodemon可以自動檢測到目錄中的檔案更改時,通過重新啟動應用程式來除錯基於node.js的應用程式。
1. 全域性安裝nodemon
npm i nodemon -g
2. 配置引導檔案lunch.json,修改為如下程式碼
{ // Use IntelliSense to learn about possible attributes. // Hover to view descriptions of existing attributes. // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387 "version": "0.2.0", "configurations": [{ "type": "node", "request": "launch", "name": "Launch Program", "preLaunchTask": "typescript", "protocol": "inspector", "program": "${workspaceFolder}/index.ts", "outFiles": [ "${workspaceFolder}/bin/*.js" ], "runtimeExecutable": "npm", "runtimeArgs": [ "run", "debug" ], "port": 5858, "env": { "NODE_ENV": "dev" }, "restart": true, "console": "integratedTerminal", "internalConsoleOptions": "neverOpen" }] }3. 修改package.json的scripts,如下:
{ // See https://go.microsoft.com/fwlink/?LinkId=733558 // for the documentation about the tasks.json format "version": "2.0.0", "tasks": [{ "label": "typescript", "type": "typescript", "tsconfig": "tsconfig.json", "isBackground": true, "problemMatcher": "$tsc-watch", "option": "watch" }] }
4. 修改task.json,如下:
"scripts": { "start": "node ./bin/index.js", "debug": "nodemon --watch ./bin --inspect=0.0.0.0:5858 --nolazy ./bin/index.js", "build": "npm run build-ts", "build-ts": "tsc", "watch": "npm run watch-ts", "watch-ts": "tsc -w" }
5. F5執行除錯,控制檯顯示如下:
6. index.ts如上篇文章內容不變,開啟瀏覽器,輸入地址:localhost:3000,顯示效果如下:
const Koa = require('koa'); const app = new Koa(); app.use(async (ctx: any) => { ctx.body = 'Hello World'; }); console.log('app server start on port 3000...') app.listen(3000);
7. 修改index.ts程式碼,如下:(僅修改:ctx.body = 'Hello World...Hello LaoLv';)
const Koa = require('koa'); const app = new Koa(); app.use(async (ctx: any) => { ctx.body = 'Hello World...Hello LaoLv'; }); console.log('app server start on port 3000...') app.listen(3000);
8. 儲存index.ts,此時控制檯自動編譯輸出內容:
9. 開啟瀏覽器,重新整理,自動更改為修改後的結果,效果如下:
到此,後端除錯,自動編譯重啟服務的功能完成。
可能F5後vs code會彈出下面問題:Cannot connect to runtime process,timeout after 10000 ms -......
解決辦法就是,launch.json中,一定要加上:"port": 5858,因為此處的port要與package.json中scripts-->debug中的 --inspect 0.0.0.0:5858的埠一致。
附:文件結構如下
&n