在 Devin 中试用 DeepWiki 处理私有仓库
DeepWiki

nestjs/nest

菜单

Babel 集成

相关源文件

本文档介绍了如何在 NestJS 应用程序中集成和使用 Babel 进行 JavaScript 转译。有关使用 Webpack 进行打包的信息，请参阅 Webpack 集成。

NestJS 中的 Babel 简介

Babel 是一个 JavaScript 编译器，它允许开发人员使用下一代 JavaScript 功能，同时保持与旧环境的兼容性。虽然 NestJS 应用程序通常使用 TypeScript 编写，但当不需要 TypeScript 或需要特定的 Babel 插件和预设时，Babel 提供了一种替代的转译方法。

来源： sample/09-babel-example/package.json24-37

必需的依赖项

要使用 Babel 与 NestJS 配合，您需要安装几个 Babel 相关的包

包目的
@babel/core核心 Babel 编译器
@babel/cliBabel 的命令行界面
@babel/node使用 Babel 即时转译运行 Node.js
@babel/preset-env用于使用最新 JavaScript 功能的智能预设
@babel/plugin-proposal-decorators支持装饰器语法（对 NestJS 至关重要）
@babel/plugin-transform-runtime重用 Babel 助手以减小包大小
@babel/runtime编译代码的运行时支持
@babel/register自动转译的 require 钩子

来源： sample/09-babel-example/package.json24-37

在 NestJS 项目中设置 Babel

以下步骤概述了如何在 NestJS 项目中设置 Babel

1. 安装依赖项

按照 package.json 中的说明安装所需的 Babel 包

npm install --save-dev @babel/cli @babel/core @babel/node @babel/plugin-proposal-decorators @babel/plugin-transform-runtime @babel/preset-env @babel/register @babel/runtime

来源： sample/09-babel-example/package.json24-37

2. 配置脚本

更新您的 package.json 脚本以使用 Babel

"scripts": {
  "build": "babel src -d dist",
  "start": "babel-node index.js",
  "start:dev": "nodemon"
}

来源： sample/09-babel-example/package.json6-13

NestJS 的 Babel 配置

为了让 NestJS 应用程序与 Babel 正常工作，您需要特定的插件和配置来支持 NestJS 所依赖的装饰器和其他功能。

NestJS 的必备 Babel 插件

  1. 装饰器支持： @babel/plugin-proposal-decorators 插件至关重要，因为 NestJS 在很大程度上依赖于装饰器来处理控制器、模块、服务等。

  2. 运行时支持： @babel/plugin-transform-runtime 用于管理 Babel 注入到代码中的运行时助手。

  3. 环境预设： @babel/preset-env 会根据您的目标环境自动确定所需的 Babel 插件。

来源： sample/09-babel-example/package.json24-37

使用 Babel 运行和构建 NestJS 应用程序

开发模式

在开发过程中，您可以使用 babel-node 来运行您的应用程序，实现即时转译

npm run start

此命令运行 babel-node index.js，该命令一步完成转译和执行您的代码。

对于支持自动重载的开发服务器，请使用

npm run start:dev

这利用 nodemon 来监视更改并自动重启服务器。

生产构建

要为生产构建应用程序

npm run build

这会使用 Babel 将您的源代码从 src 目录转译到 dist 目录。

来源： sample/09-babel-example/package.json6-13

使用 Babel 进行测试

示例项目使用 Jest 进行测试，并配置为与 Babel 转译后的 JavaScript 一起工作

package.json 中的 Jest 配置指定了

此配置告诉 Jest 在 src 目录中查找 .spec.js 文件，并理解 JavaScript 和 JSON 文件。

来源： sample/09-babel-example/package.json39-47

比较：NestJS 中的 TypeScript vs. Babel

功能TypeScript 方法Babel 方法
类型检查是，在编译时否，需要 Flow 等附加工具
装饰器支持原生通过插件
元数据反射通过 emitDecoratorMetadata需要额外设置
文件扩展名.ts.js
构建速度可能较慢通常更快
IDE 集成优秀良好
学习曲线更陡峭（TypeScript + JS）不那么陡峭（仅 JS）

来源： sample/09-babel-example/package.json

优点和局限性

使用 Babel 与 NestJS 的优势

  1. 纯 JavaScript 代码库：如果您的团队更熟悉 JavaScript，则无需学习 TypeScript。
  2. 灵活的转译：可以访问各种 Babel 插件和预设。
  3. 更快的编译：Babel 通常比 TypeScript 编译器更快，因为它不执行类型检查。
  4. 更易集成：与其他基于 JavaScript 的工具和库集成。

局限性

  1. 无类型安全：丢失 TypeScript 的静态类型检查，后者可以在编译时捕获错误。
  2. 降低的 IDE 支持：没有 TypeScript，一些 IDE 功能（如自动完成和重构）可能功能较弱。
  3. 手动装饰器配置：需要手动设置装饰器支持，而 TypeScript 的处理方式更自然。
  4. 文档不匹配：大多数 NestJS 文档都使用了 TypeScript 示例。

来源： sample/09-babel-example/package.json

结论

Babel 为 NestJS 应用程序提供了一种可行的 TypeScript 替代方案，特别是对于更熟悉 JavaScript 或拥有现有 JavaScript 代码库的团队。通过正确的插件和配置，Babel 可以支持 NestJS 所依赖的所有核心功能，包括装饰器和元数据反射。

虽然由于其类型安全和一流的支持，TypeScript 仍然是大多数 NestJS 应用程序的推荐方法，但 Babel 集成为特定用例和偏好提供了灵活性。

来源： sample/09-babel-example/package.json