如何在Node Express中使用TypeScript

在Vue或者React项目中使用TS已经有各类脚手架的支持了，但如何在node express应用中使用TS呢？

首先，初始化一下项目：

npm init -y

如果本地没有全局下载typescript，那此时可以把ts作为开发依赖：

npm i -D typescript
npm i express

并且下载node和express的类型。

npm i -D @types/express @types/node

然后再初始化ts配置文件。

tsc --init  # 全局安装了typescript
# npx tsc --init 如果没有全局安装ts，就前面加一个npx命令

在tsconfig.json 文件中，在compilerOptions 选项中，我们将outDir从根目录改成 /dist ，将rootDir改成/src。（当然具体叫什么名字，怎么放，都可以自定义你想要的。）

{
  "compilerOptions": {
    /* Visit https://aka.ms/tsconfig to read more about this file */
    "target": "es2016" /* Set the JavaScript language version for emitted JavaScript and include compatible library declarations. */,
    "module": "ESNext" /* Specify what module code is generated. */,
    "rootDir": "./src",
    "outDir": "./dist" /* Specify the root folder within your source files. */,
    "esModuleInterop": true /* Emit additional JavaScript to ease support for importing CommonJS modules. This enables 'allowSyntheticDefaultImports' for type compatibility. */,
    "forceConsistentCasingInFileNames": true /* Ensure that casing is correct in imports. */,
    "strict": true /* Enable all strict type-checking options. */,
    "skipLibCheck": true /* Skip type checking all .d.ts files. */
  },
  // 如果使用的es6模块语法，记得加上
  "ts-node": {
    "esm": true
  }
}

根据上面的配置，我的文件夹结构是这个样子：

然后，我们可以给 app.ts 文件写下如下内容，用作测试：

import express, { Express, Request, Response } from 'express';
const app: Express = express();

app.get('/', (req: Request, res: Response) => {
  res.send('Express + TypeScript Server');
});

app.listen(3000, () => {
  console.log(` running at http://localhost:3000`);
});

然后，我们得下载一下nodemon，持续重新执行我们写的程序：

npm i -D nodemon

最后在package.json的script节点，增加如下2行命令：

{
    "scripts": {
      "dev": "nodemon ./src/app.ts",
      "build":"tsc"
    },
    // 如果使用的是es6模块语法，记得加上这行
    "type": "module",
}

如果我们运行npm run dev，nodemon就会调用ts-node持续监视我们的代码更新并重新执行。运行命令npm run build 将会生成js文件。

以上，就是如何在express应用中使用ts。