從零開始學typescript— 自動編譯

lifefriend_007發表於2019-01-15
TypeScript編譯

上一篇 從零開始學typescript構建一個rest風格web服務 我們搭建了一個 web 伺服器，細心的讀者有沒有發現當我們改動 server.ts 的內容後，程式並不會自動編譯。每次檢視改動後的效果需要手動執行兩行命令

.\node_modules\.bin\tsc
node ./dist/server.js
複製程式碼

是不是覺得有點小麻煩，這次我們就來解決這個痛點

首先安裝 nodemon 用來替換 node 命令，nodemon 的好處是能夠監聽檔案內容的改變並自動載入執行。

yarn add nodemon  --dev
複製程式碼

第一個問題，自動編譯就解決了。第二個問題，如何把二行命令合併為一個命令呢，而二個命令還是有先後順序的，ts 得先編譯成 js 再執行，這個次序是不能亂的。這裡我們藉助 concurrently 來完成。

安裝 concurrently

yarn add concurrently --dev
複製程式碼

然後在 package.json 檔案中編寫如下指令

"main": "./dist/server.js",
"scripts": {
    "server": "nodemon main",
    "dev": "tsc && concurrently \"npm run tsc\" \"npm run server\"",
    "build": "tsc",
    "tsc": "tsc -w"
}
複製程式碼

以後開發時直接執行 yarn run dev 就能完成自動監聽檔案，自動編譯了， 我們改動內容後，只需要耐心等待編譯完成然後重新整理就能看到最新的內容了，是不是很酷。

相關文章