如何设置 Node、TypeScript 和 Express

TypeScript 是 JavaScript 的超集,提供了强类型支持,让开发者可以编写更安全、更健壮的代码。在本文中,我们将探讨如何将 TypeScript 与 Node.js 和 Express 一起使用,并构建一个简单的应用程序。

原文链接

前提条件

要完成本教程,你需要以下工具:

  • 安装了 Node.js(建议使用 v16 或更高版本)
  • 基本的 JavaScript 和 Node.js 知识

第一步:初始化项目

首先,我们需要创建一个新目录并初始化一个新的 Node.js 项目。在终端中运行以下命令:

mkdir node-ts-express
cd node-ts-express
npm init -y

这将创建一个新的 package.json 文件,默认设置所有值。接下来,我们将安装 TypeScript 和一些必要的依赖项。

第二步:安装 TypeScript 及其他依赖项

为了使用 TypeScript,我们需要安装 TypeScript 编译器和 Node.js 的类型定义:

npm install typescript ts-node @types/node --save-dev
  • typescript 是 TypeScript 编译器
  • ts-node 允许我们在 Node.js 中直接运行 TypeScript 文件,而无需手动编译
  • @types/node 包含 Node.js API 的类型定义

接下来,我们还需要安装 Express 和其类型定义:

npm install express
npm install @types/express --save-dev

第三步:配置 TypeScript

接下来,我们将设置 TypeScript 配置文件 tsconfig.json。在项目根目录下运行以下命令:

npx tsc --init

这个命令将在项目根目录中生成一个 tsconfig.json 文件。打开这个文件,确保以下选项被正确设置:

{
  "compilerOptions": {
    "target": "ES6",
    "module": "commonjs",
    "outDir": "./dist",
    "rootDir": "./src",
    "strict": true,
    "esModuleInterop": true
  }
}
  • target 设置了编译后的 JavaScript 版本(在本例中为 ES6)
  • module 指定模块系统(在本例中为 CommonJS)
  • outDir 指定编译后文件的输出目录
  • rootDir 定义 TypeScript 源文件所在的目录
  • strict 启用严格的类型检查选项
  • esModuleInterop 允许兼容 CommonJS 和 ES 模块

第四步:创建 Express 服务器

现在,我们可以开始编写代码了。首先,创建一个 src 目录,并在其中创建一个名为 index.ts 的文件:

mkdir src
touch src/index.ts

index.ts 文件中,添加以下代码:

import express, { Request, Response } from 'express';

const app = express();
const PORT = 3000;

app.get('/', (req: Request, res: Response) => {
  res.send('Hello, TypeScript with Node.js!');
});

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

在这段代码中,我们导入了 Express 和类型定义,并创建了一个基本的 Express 服务器。服务器监听 3000 端口,并在根路由 / 返回一个简单的消息。

第五步:运行 TypeScript 应用程序

为了运行这个 TypeScript 应用程序,我们可以使用 ts-node 命令。运行以下命令:

npx ts-node src/index.ts

这将启动服务器,你可以在浏览器中访问 http://localhost:3000,并看到页面显示 "Hello, TypeScript with Node.js!"。

第六步:编译 TypeScript 代码

尽管 ts-node 非常方便,但在生产环境中,你通常会编译 TypeScript 代码为 JavaScript,然后运行编译后的代码。要编译 TypeScript 代码,运行以下命令:

npx tsc

这将编译 src 目录中的所有 TypeScript 文件,并将编译后的 JavaScript 文件输出到 dist 目录中。你可以通过以下命令运行编译后的应用程序:

node dist/index.js

总结

在本文中,我们介绍了如何在 Node.js 项目中设置 TypeScript,并使用 Express 创建了一个简单的服务器。TypeScript 提供的强类型检查和其他特性,使得它成为构建更大规模、复杂应用程序的理想选择。

你可以根据项目需求扩展此设置,添加更多的中间件、路由、控制器等。希望你在使用 TypeScript 构建 Node.js 应用时取得成功!

作者: erishen

前端工程师 React, React Native, Taro Node.js, Next.js, Express, Nest.js PHP, Java / Spring Boot Python, Go, Rust ...

发表回复

您的电子邮箱地址不会被公开。 必填项已用 * 标注