快速搭建一个 TypeScript + Node 服务端开发环境_ts使用express-generator-优快云博客

本文链接：https://blog.youkuaiyun.com/iamxuqianqian/article/details/116747915

本文介绍了如何快速搭建一个基于TypeScript和Node.js的服务端开发环境。首先通过express-generator初始化项目，接着改造工程将JavaScript文件转换为TypeScript，解决编译过程中遇到的类型问题。然后配置编译ts为js，拷贝静态资源，设置npm build脚本，最后启动服务器并启用watch监控模式，实现自动重启应用，提升开发效率。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

在 ts + react 系列中，数据都是本地的 mock，那么如何搭建一个真实的 API server 呢？

按照惯例，先搭建一个基于 ts + express 的服务端开发环境：

初始化

express-generator

express-generator：快速创建 Express 应用程序框架。

可以使用 npx 命令（在 Node.js 8.2.0 中可用）运行应用程序生成器。

$ npx express-generator ts-express

对于早期的 Node 版本，可将应用程序生成器作为全局 npm 软件包安装，然后启动它。

$ npm install -g express-generator
$ express ts-express

typescript

安装 typescript

$ npm i -D typescript

生成配置文件 tsconfig.json

$ tsc --init

工程改造（js2ts）

将工程里的 .js 文件都重命名为 .ts 文件。

bin/www 是整个服务端的启动脚本。

// bin/www
// 修改服务端端口 3000 -> 40001
var port = normalizePort(process.env.PORT || "4001");

改完之后，肯定出现了大量报错，莫慌，我们一起来修改：

Cannot find name ‘require’.

require 未定义，因为缺少声明文件

$ npm i --save-dev @types/node @types/express

参数类型未定义

express 声明文件最终的导出方式是 export =，它对应的导入方式是 import = / import from

/*
 ** node_modules/@types/express/index.d.ts
 */
...
export = e;

而我们的导入方式是 require

/*
 ** app.ts
 */
var express = require("express");

统一将模块的导入改为 import from，并安装声明文件

$ npm i -D @types/http-errors @types/cookie-parser @types/morgan @types/debug

app.use

export interface IRouterHandler<