在 Node.js 中使用 TypeScript

本文以 Koa2 搭建一个 HTTP 服务器为案例，去介绍如何在 Node.js 项目中使用 TypeScript，读者能在 github.com/react-low-c… 找到全部源码。

在 Node.js 中使用 TypeScript

在项目中安装 TypeScript，并在根目录创建 tsconfig.json，内容如下：

{
  "compilerOptions": {
    "rootDir": "./src",
    "outDir": "./dist",
    "esModuleInterop": true,
    "strict": true,
    "moduleResolution": "node",
    "isolatedModules": true,
    "module": "ESNext",
    "target": "ESNext",
  },
  "ts-node": {
    "esm": true
  },
  "exclude": [
    "./node_modules"
  ]
}

TypeScript官方网站（www.typescriptlang.org/tsconfig） 罗列了 TypeScript 配置文件全部字段的含义。

监听代码的变更

nodemon 能检测 Node.js 应用程序中代码的任何变更，当有文件变更，它会重启服务执行代码。自v1.19.0 之后，nodemon 不需要手动配置即可支持 TypeScript 文件。默认情况，nodemon 使用node cli 运行 JavaScript 文件，使用 ts-node 运行 TypeScript 文件，因此用 nodemon 监听 TypeScript 文件的变化，除了要安装 nodemon 还要安装 ts-node。如果需要自定义 nodemon 的行为，可在项目根目录中新建 nodemon.json，它是 nodemon 的配置文件。

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

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

启动 Web 服务器

用 Koa 启动一个 Web 服务器非常简单，代码清单 1 如下：

import Koa from 'koa'

const app = new Koa()
app.use(context => {
    context.body = 'Hello Koa';
})

app.listen(3000)

运行上述代码在浏览器访问 http://localhost:3000/, 如果一切正常，那么浏览器将显示‘Hello Koa’这串字符串。

app.listen

app.listen 看上去像是监听某个端口，实际上它是创建并返回HTTP服务器，是如下代码的简写：

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

在同一个 Koa 应用程序中可以多次调用app.listen创建多个 HTTP 服务器，比如在代码清单 1 新增app.listen(3001)，然后在浏览器访问 http://localhost:3001/, 网页将显示‘Hello Koa’这串字符串。

app.use

前面提到过 Koa 本身的代码很简洁，开发人员可以使用不同的中间件增强 Koa 的功能，中间件可以是开源的 npm 包，也可以是你自己在项目中开发的一个函数。调用 app.use ()添加中间件，代码如下：

app.use(async(context, next) => {
    // 在响应头中增加 X-Response-Time
    context.set('X-Response-Time', `${new Date().getTime()}`);
    await next()
    console.log('finish')
})

app.use(async(context) => {
    console.log('set body')
    context.body = 'Hello Koa';
})

上述代码给 app 添加了两个中间，第一个中间件在调用 next() 之后暂停执行，将代码的执行权交给第二个中间件，当第二个中间件执行结束之后，代码的执行权又回到第一个中间件，因此console.log('set body') 会比 console.log('finish') 早执行。

context

代码清单 1 使用了 context 变量，它一个Context对象，在中间件之间共享，包含很多属性和方法，每个请求都有一个 Context 对象。如果要将某个中间件的处理结果传递到其他中间件，那么可以将数据保存到 Context 对象上。

总结

想要 nodemon 监听 TypeScript 文件的变化，除了需要安装 nodemon，还有安装 ts-node，其他部分与直接用 JavaScript 开发 Node 项目没有区分。