本文以 Koa2 搭建一個(gè) HTTP 服務(wù)器為案例，去介紹如何在 Node.js 項(xiàng)目中使用 TypeScript，讀者能在 https://github.com/react-low-code/theory/tree/master/server 找到全部源碼。

在 Node.js 中使用 TypeScript

在項(xiàng)目中安裝 TypeScript，并在根目錄創(chuàng)建 tsconfig.json，內(nèi)容如下：

TypeScript官方網(wǎng)站（https://www./tsconfig） 羅列了 TypeScript 配置文件全部字段的含義。

監(jiān)聽代碼的變更

nodemon 能檢測(cè) Node.js 應(yīng)用程序中代碼的任何變更，當(dāng)有文件變更，它會(huì)重啟服務(wù)執(zhí)行代碼。自v1.19.0 之后，nodemon 不需要手動(dòng)配置即可支持 TypeScript 文件。默認(rèn)情況，nodemon 使用node cli 運(yùn)行 JavaScript 文件，使用 ts-node 運(yùn)行 TypeScript 文件，因此用 nodemon 監(jiān)聽 TypeScript 文件的變化，除了要安裝 nodemon 還要安裝 ts-node。如果需要自定義 nodemon 的行為，可在項(xiàng)目根目錄中新建 nodemon.json，它是 nodemon 的配置文件。

在 package.json 增加 scripts，使 yarn server 指向 nodemon ./src/index.ts：

'scripts': {
    'server': 'nodemon ./src/index.ts'
}

啟動(dòng) Web 服務(wù)器

用 Koa 啟動(dòng)一個(gè) Web 服務(wù)器非常簡(jiǎn)單，代碼清單 1 如下：

運(yùn)行上述代碼在瀏覽器訪問 http://localhost:3000/, 如果一切正常，那么瀏覽器將顯示'Hello Koa’這串字符串。

app.listen

app.listen 看上去像是監(jiān)聽某個(gè)端口，實(shí)際上它是創(chuàng)建并返回HTTP服務(wù)器，是如下代碼的簡(jiǎn)寫：

http.createServer(app.callback()).listen(...)

在同一個(gè) Koa 應(yīng)用程序中可以多次調(diào)用app.listen創(chuàng)建多個(gè) HTTP 服務(wù)器，比如在代碼清單 1 新增app.listen(3001)，然后在瀏覽器訪問 http://localhost:3001/, 網(wǎng)頁將顯示'Hello Koa’這串字符串。

app.use

前面提到過 Koa 本身的代碼很簡(jiǎn)潔，開發(fā)人員可以使用不同的中間件增強(qiáng) Koa 的功能，中間件可以是開源的 npm 包，也可以是你自己在項(xiàng)目中開發(fā)的一個(gè)函數(shù)。調(diào)用 app.use ()添加中間件，代碼如下：

上述代碼給 app 添加了兩個(gè)中間，第一個(gè)中間件在調(diào)用 next() 之后暫停執(zhí)行，將代碼的執(zhí)行權(quán)交給第二個(gè)中間件，當(dāng)?shù)诙€(gè)中間件執(zhí)行結(jié)束之后，代碼的執(zhí)行權(quán)又回到第一個(gè)中間件，因此console.log('set body') 會(huì)比 console.log('finish') 早執(zhí)行。

context

代碼清單 1 使用了 context 變量，它一個(gè)Context對(duì)象，在中間件之間共享，包含很多屬性和方法，每個(gè)請(qǐng)求都有一個(gè) Context 對(duì)象。如果要將某個(gè)中間件的處理結(jié)果傳遞到其他中間件，那么可以將數(shù)據(jù)保存到 Context 對(duì)象上。

總結(jié)

想要 nodemon 監(jiān)聽 TypeScript 文件的變化，除了需要安裝 nodemon，還有安裝 ts-node，其他部分與直接用 JavaScript 開發(fā) Node 項(xiàng)目沒有區(qū)分。