如何使用Express设置TypeScript

是一种强类型编程语言，它扩展了 JavaScript 的功能。它提供了一系列功能，可帮助您使用 Node.js 和 Express 开发可扩展的应用程序。

与 JavaScript 相比，TypeScript 的关键优势之一是它提供了类型类，使编写更可预测、更可维护的代码变得更加容易。此外，TypeScript 还提供了类型安全性，确保您的代码不会出现运行时错误，并能在开发早期更容易地发现缺陷。该语言还配备了重构工具和自动完成功能，从而改善了开发人员的体验。

此外， 可为任何规模的应用程序提供出色的性能。在 TypeScript 中使用类还有助于组织和结构，进一步提高可扩展性。有了这些工具，您就可以构建稳健且可扩展的应用程序，以应对不断增长的需求。

本文演示了如何使用 TypeScript 通过单个端点设置 Express 应用程序。然后，它将介绍如何将应用程序部署到应用程序托管服务器。

如何创建 Express 服务器

要学习本教程，请确保您的计算机上安装了 。设置 Express 服务器：

1. 使用下面的代码创建一个目录：

   mkdir sample_app && cd sample_app

2. 运行此命令在目录中初始化 Node.js 应用程序：

   npm init -y

   命令中的 -y 标志接受创建 package.json 文件时的默认提示，该文件由以下代码填充：

   Explain

   { 
   "name": "sample_app",
   "version": "1.0.0",
   "description": "", 
   "main": "index.js", 
   "scripts": { 
   "test": "echo \"Error: no test specified\" && exit 1" 
   }, 
   "keywords": [], 
   "author": "", 
   "license": "ISC" 
   }

3. 接下来，在刚刚创建的目录中安装用于添加基本功能的 express 和用于环境变量管理的 dotenv，运行此命令：

   npm i express dotenv

4. 在 sample_app 目录根目录下创建 .env 文件，并在其中填入以下变量。

   PORT=3000

5. 创建一个 express 应用程序，当用户访问 http://localhost:3000 时，该程序会响应 Hello World 文本。

   const express = require("express");
   const dotenv = require("dotenv");
   // configures dotenv to work in your application
   dotenv.config();
   const app = express();
   const PORT = process.env.PORT;
   app.get("/", (request, response) => { 
   response.status(200).send("Hello World");
   }); 
   app.listen(PORT, () => { 
   console.log("Server running at PORT: ", PORT); 
   }).on("error", (error) => {
   // gracefully handle error
   throw new Error(error.message);
   })

   dotenv.config() 使用 .env 文件中定义的变量填充 Node 应用程序的进程环境（ process.env ）。

6. 运行此命令启动 Node.js 应用程序：

   node index.js

   在浏览器 *** 问 http://localhost:3000，检查应用程序是否正常运行。您应该会得到与此类似的响应。

   

在 Express 应用程序中启用 TypeScript

按照以下步骤在 Express 应用程序中使用 TypeScript：

1. 运行此命令安装 TypeScript：

   npm i -D typescript

   通过 -D 选项， 可以将软件包安装为开发依赖包。你可以在开发阶段使用该选项安装的软件包。

2. 是 TypeScript 社区的优势之一。它存储了各种 npm 软件包的类型定义文档。DefinitelyTyped 是 TypeScript 开发人员不可或缺的工具。DefinitelyTyped 是 TypeScript 开发人员不可或缺的工具，它能让开发人员编写更简洁、更高效的代码，并降低出错的可能性。您可以通过运行此命令安装 express 和 dotenv 的类型定义：

   npm install -D @types/express @types/dotenv

3. 要初始化 TypeScript，请运行此命令。

   npx tsc --init

   生成的 tsconfig.json 文件指出了你的 TypeScript 应用程序的根目录。它提供了定义 TypeScript 编译器工作方式的 config 选项。它包括一系列禁用或启用的配置选项，并附有注释解释每个选项。

4. 在 config对象中添加 outDir 属性，以定义输出目录。

   {
   "compilerOptions": {
   // …
   "outDir": "./dist"
   // …
   }
   }

如何创建 TypeScript 服务器

要创建 TypeScript 服务器，请将 .js 扩展名更改为 .ts 并使用这些类型定义更新代码：

import express, { Request, Response } from "express";
import dotenv from "dotenv";
// configures dotenv to work in your application
dotenv.config();
const app = express();
const PORT = process.env.PORT;
app.get("/", (request: Request, response: Response) => { 
response.status(200).send("Hello World");
}); 
app.listen(PORT, () => { 
console.log("Server running at PORT: ", PORT); 
}).on("error", (error) => {
// gracefully handle error
throw new Error(error.message);
});

要使用编译器软件包并将 TypeScript 文件编译成 ，请在应用程序的根目录下运行以下命令。

npx tsc

然后运行命令启动应用程序。

node dist/index.js

在浏览器 *** 问 http://localhost:3000 时，会得到 “Hello World” 的响应。

如何将 TypeScript 服务器部署到线上

现在，您已经准备好将应用程序部署到 Web 上了。您可以将应用程序部署到许多平台。

在将应用程序推送到 Git 仓库之前，使用 TypeScript 并将编译好的 JavaScript 文件提交到 Git 并不可取。在 package.json 文件中包含一个 start 脚本。

{
// …
"script": {
"start": "npx tsc && node dist/index.js",
}
// …	
}

此外，在应用程序的根目录中创建 文件，并包含 node_modules 和 .env 以防止将这些文件推送到 Git 提供者。

设置好仓库后，请按照以下步骤将应用程序部署到线上（以 Kinsta 为例）：

存储库设置完成后，请按照以下步骤将应用程序部署到 Kinsta：

1. 登录或创建账户，查看 面板。
2. 使用 Git 提供商授权 Kinsta。
3. 单击左侧边栏上的 “Applications“，然后单击 “Add application“。
4. 选择要部署的版本库和分支。
5. 为应用程序指定一个唯一的名称，并选择 Data center location。
6. 使用所有默认配置。MyKinsta 使用 npm start 作为部署应用程序的入口点。如果您想使用其他命令，可以在 MyKinsta 中调整运行时进程。
7. 单击 Create application。

部署完成后，MyKinsta 会提供一个 URL 以公开访问您的应用程序部署。您可以访问该页面，确认是否显示 “Hello World”。

小结

本指南演示了如何使用 TypeScript 开发和设置 Express 应用程序，并使用线上服务器部署应用程序。TypeScript 拥有 JavaScript 所没有的额外功能（包括类型类、类型安全、重构工具和自动完成），可帮助您构建可扩展的应用程序并在开发过程中捕捉错误。

您过去使用过 TypeScript 吗？您对在 Express 服务器上使用它有什么看法？