在 Express.js 项目中使用 TypeScript 的指南

阅读时长 4 分钟读完

TypeScript 是一种由微软开发的静态类型检查的 JavaScript 的超集。使用 TypeScript 可以大幅减少前端开发中的错误和调试时间。在本文中,我们将讨论如何在 Express.js 项目中使用 TypeScript。

准备工作

在开始使用 TypeScript 前,我们需要安装以下几个工具:

  1. Node.js:用于运行 JavaScript 程序的环境。
  2. TypeScript:用于将 TypeScript 代码编译成 JavaScript 代码的编译器。
  3. Express.js:一个基于 Node.js 的快速开发 Web 应用的框架。

可以在终端中使用以下命令来安装它们:

安装完成后,我们可以开始创建 Express.js 项目。

创建项目

我们将使用 TypeScript 和 Express.js 来创建一个简单的 Web 服务器。

首先,创建一个新文件夹,进入文件夹,然后运行以下命令来初始化项目:

创建完项目后,我们需要创建一个 tsconfig.json 文件来告诉编译器如何编译 TypeScript 文件。在项目根目录下创建一个 tsconfig.json 文件,并将以下内容复制到文件中:

-- -------------------- ---- -------
-
  ------------------ -
    --------- ------
    --------- -----------
    ------------ -----
    --------- ---------
    ---------- --------
    ------------------ ----
  --
  ---------- -
    ----------
  --
  ---------- -
    --------------
  -
-

这个配置文件告诉编译器将 TypeScript 函数编译成“commonjs”,并将输出文件放在“dist”文件夹中。此外,它还指定了项目中的源码目录为“src”。

现在我们需要安装一些 TypeScript 相关的依赖。运行以下命令将它们安装到项目中:

这些包中:

  • @types/node@types/express 提供了 TypeScript 对 Node.js 和 Express.js 类型定义的支持。
  • typescript 包提供了 TypeScript 编译器和语言特性支持。
  • ts-node 提供了使用 TypeScript 执行 JavaScript 脚本的功能。
  • nodemon 提供了自动重启应用程序的功能。

我们可以使用 ts-node 或者 tsc 来启动 TypeScript 应用程序。为了方便开发,我们将使用 nodemon 来监视应用程序的变化并重新启动:

创建 Express.js 应用程序

现在我们可以开始编写应用程序了。创建一个名为 server.ts 的文件,然后将以下代码复制到文件中:

-- -------------------- ---- -------
------ -------- - -------- -------- - ---- ----------

----- --- - ----------
----- ---- - ---------------- -- -----

------------ ----- -------- ---- --------- -- -
  ---------------- ---------
---

---------------- -- -- -
  ------------------- -- ------- -- ---- ----------
---

这个应用程序非常简单,我们创建了一个名为“app”的 Express.js 实例,并将其监听在默认端口或者环境变量“PORT”的值下。它还定义了一个路由来处理根路径,并返回一个简单的响应。

在浏览器中测试

让我们运行应用程序并测试一下它是否正常工作。在终端中输入以下命令:

在浏览器中输入“http://localhost:3000”并回车。如果一切正常,您将看到一个显示“Hello, world!” 的页面。

结论

在本文中我们讨论了如何在 Express.js 项目中使用 TypeScript,并创建了一个简单的 Web 服务器。使用 TypeScript 可以让我们的应用程序更加健壮和可维护。

来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/67380618317fbffedf0dc206

纠错
反馈