nodemon實現(xiàn)Typescript項目熱更新的示例代碼
我們都知道nodemon可以直接用來在開發(fā)環(huán)境下運行js文件，可以在文件改變時自動刷新和重啟服務(wù)器。但是最近剛好在學(xué)typescript，所以就想使用ts來寫，也想達到同樣的效果，總結(jié)一下方法，大概有如下幾種：
nodemon+tsc:
這個方法很簡單，首先通過tsc將我們的ts文件編譯到dist目錄下，然后再通過nodemon直接運行dist目錄下的文件即可。至于ts的輸出目錄相關(guān)配置可在tsconfig.js中設(shè)置。
tsc && nodemon --watch dist/index.js
但是這種方式有個缺點，就是nodemon只監(jiān)聽了dist目錄，可能有時候你修改了源碼并不能觸發(fā)熱更新，另外還有個問題就是多了一個dist目錄中轉(zhuǎn)，感覺不爽。
nodemon+ts-node:
命令如下：
nodemon -e ts,tsx --exec ts-node ./index.ts"
大概意思就是監(jiān)聽文件增加ts、tsx兩種文件類型，使用ts-node運行index.ts文件。
當(dāng)然，上述參數(shù)是設(shè)置在命令行中的，也可以在nodemon.json中設(shè)置：
{
"verbose": false,
"debug": false,
"exec": "ts-node ./index.ts",
"ignore": [
"mochawesome-report",
"node_modules",
"./test",
"**/*.d.ts",
"*.test.ts",
"*.spec.ts",
"fixtures/*",
"test/**/*",
"docs/*"
],
"events": {
"restart": ""
},
"watch": ["./app", "./configs", "./app.ts"],
"ext": "ts tsx",
"inspect": true
}
如果有使用到tsx文件，記得在tsconfig.json文件中將jsx取消注釋,否則編譯時可能會提示錯誤。
除了上述兩種方法，今天無意中試了下直接使用nodemon來執(zhí)行ts文件，發(fā)現(xiàn)控制臺報錯了，原諒我是個英語渣，不明白具體說了什么，但是看到了ts-node的身影，果斷安裝ts-node再試，竟然成功了。
nodemon ./index.ts
但是這樣修改了ts文件不會熱更新，可以在nodemon.json文件中將ext屬性添加上ts就可以了。
{
"restartable": "rs",
"ignore": [".git", "node_modules/**", "client/*", "dist", ".cache", "logs"],
"verbose": true,
"execMap": {
"": "node",
"js": "node --harmony"
},
"events": {
"start": "",
"crash": "",
"exit": "",
"restart": ""
},
"ext": "js json ts tsx",
"watch": ["./**"],
"env": {
"NODE_ENV": "development",
"PORT": "3002"
},
"legacy-watch": false
}
當(dāng)然除了上述方式，還可以使用構(gòu)建工具來進行處理，如webpack，parcel等，當(dāng)然如果大家有其他好的建議，歡迎交流。
以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。
相關(guān)文章
詳解express使用vue-router的history踩坑
這篇文章主要介紹了express 使用 vue-router 的 history 踩坑，文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-06-06
NodeJS?Express使用ORM模型訪問關(guān)系型數(shù)據(jù)庫流程詳解
這篇文章主要介紹了NodeJS?Express使用ORM模型訪問關(guān)系型數(shù)據(jù)庫流程，文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)吧2023-01-01
Node在Controller層進行數(shù)據(jù)校驗的過程詳解
這篇文章主要給大家介紹了關(guān)于Node在Controller層進行數(shù)據(jù)校驗的相關(guān)資料，文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-08-08
這篇文章主要為大家介紹了OpenSCA技術(shù)原理npm依賴示例解析，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2023-02-02
這篇文章主要介紹了koa2使用ejs和nunjucks作為模板引擎的使用，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-11-11
nodejs?實現(xiàn)簡單的文件上傳功能(示例詳解)
這篇文章主要介紹了nodejs?實現(xiàn)簡單的文件上傳功能,文件上傳方式分為三種，本文通過實例代碼給大家詳細介紹，對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值，需要的朋友可以參考下2022-02-02
本文主要介紹了Node.js的入門知識，包括：Node.js的特點，運行環(huán)境以及應(yīng)用小例。具有一定的參考價值，下面跟著小編一起來看下吧2017-01-01
Node.js創(chuàng)建HTTP文件服務(wù)器的使用示例
我們的目的比較簡單，使用Node.js創(chuàng)建一個HTTP協(xié)議的文件服務(wù)器，你可以使用瀏覽器或其它下載工具到文件服務(wù)器上下載文件，具有一定的參考價值，感興趣的小伙伴們可以參考一下2018-05-05
nodejs文件實現(xiàn)打包成exe, 并設(shè)置開機自啟動的方法詳解(沒有黑窗口)
這篇文章主要介紹了nodejs文件實現(xiàn)打包成exe, 并設(shè)置開機自啟動的方法,結(jié)合實例形式分析了node.js使用pkg包實現(xiàn)生成exe可執(zhí)行文件的相關(guān)操作技巧,需要的朋友可以參考下2023-05-05
nodejs使用http模塊發(fā)送get與post請求的方法示例
這篇文章主要介紹了nodejs使用http模塊發(fā)送get與post請求的方法,結(jié)合實例形式分析了nodejs基于http模塊實現(xiàn)發(fā)送get與post請求具體操作技巧,需要的朋友可以參考下2018-01-01