nestjs使用ESM模块化

nestjs使用ESM模块化

引言

  • 在去年2023年我就有想过为什么不改造成ESM模块化呢?这样可以避免大量CJS引入ESM包的错误,当我改造完毕后node服务可以正常运行,但jest单元测试始终有问题
  • 今年nest支持swc、vitest后,我觉得可以再次尝试,swc将代码转为ESM模块化产物,vitest + swc运行ESM模块化产物,以此证明我的猜想

结论

  • vitest + swc下,node服务在ESM下正常运行,vitest ESM正常运行
  • 适用场景:验证自己的猜想、对构建工具的掌握、对纯node ESM的极端主义

🚨注意:永远不要将非官方支持的内容带入到生产环境!所以,这里只是借鉴一种思路,不保证tsconfig-path等各种nest扩展(swagger cli、graphQL能正常)
🚀原因:由于nestjs目前未有迁移到ESM的打算,尽量使用CJS正常开发业务,目前nodejs推出了--experimental-require-module机制(CJS/ESM允许互导包的特性,🤔忘了v22.4+还是多少可用),未来可能nestjs团队过度更慢,所以更加推荐CJS使用nestjs项目

项目

测试

bash 复制代码
pnpm i
npm i
​
# 测试 vitest + swc的测试用例
pnpm test
pnpm test:e2e
​
# 运行,访问http://localhost:8888,会返回hello world!,在控制台会看到got的请求返回值
pnpm dev
​
# 规范测试
pnpm lint
pnpm format

实现ESM核心步骤

  1. package.json的"type"设置为"module"(不理解的可以参考:gist.github.com/sindresorhu...
json 复制代码
{
  ...
  "type": "module",
  ...
}
  1. 定义swc配置文件,查看.swcrc文件
bash 复制代码
{
  "$schema": "https://swc.rs/schema.json",
  "jsc": {
    "target": "esnext"
  },
  "module": {
    "type": "es6"
  },
  "minify": false
}
  1. swc与tsconfig.json的兼容性,查看为了迁移到SWC的配置项注释后的额外配置(swc迁移文档:swc.rs/docs/migrat...
json 复制代码
// 为了迁移到SWC的配置项
"isolatedModules": true,
"importsNotUsedAsValues": "error",
"esModuleInterop": true
  1. ESM后 eslint v9-都不支持,所以改名为.eslintrc.cjs使用CJS模块化运行
java 复制代码
module.exports = {
  // ...
  env: {
    // ...
  },
  ignorePatterns: ['.eslintrc.cjs'], // 忽略
  rules: {
    // ...
  },
};
​
  1. prettier 不受影响不用管
  2. 配置nest-cli.json让其支持swc并读取swc配置
perl 复制代码
{
  "$schema": "https://json.schemastore.org/nest-cli",
  "collection": "@nestjs/schematics",
  "sourceRoot": "src",
  "compilerOptions": {
    "builder": {
      "type": "swc",
      "options": {
        "swcrcPath": ".swcrc"
      }
    }
  }
}
​

got这个http请求依赖包最新版是纯ESM,可以通过查看dist目录内的源码,根据导入语句可以分辨是否已转成ESM

相关推荐
ai_xiaogui3 分钟前
PanelAI前端全面升级!私有化部署AI面板控制台+生态市场一键管理详解
前端·人工智能·comfyui一键部署·生态市场算力共享·ai面板控制台·panelai私有化部署·大模型前端管理
Jelena157795857924 分钟前
1688.item_get_app接口:包装尺寸重量信息深度解析
开发语言·前端·python
酉鬼女又兒13 分钟前
零基础快速入门前端DOM核心知识点详解与蓝桥杯Web赛道备考指南(可用于备赛蓝桥杯Web应用开发)
前端·职场和发展·蓝桥杯
daols8819 分钟前
vue甘特图vxe-gantt实现点击任务条弹出编辑表单
前端·vue.js·甘特图·vxe-gantt
Fairy要carry22 分钟前
项目05-手搓Agent之任务通信+任务编排的实现
服务器·前端·网络
忘忧记22 分钟前
pytest进阶参数化用法
前端·python·pytest
github_czy37 分钟前
FastAPI 流式响应核心原理解析(含前端断开感知)
前端·fastapi
Lana学习中37 分钟前
[AI编程]纯前端JS实现评论区自动截图&生成 PDF
前端·javascript·pdf·vibe coding
鹏程十八少40 分钟前
7. Android Shadow插件化原理深挖(下):Transform字节码插桩与“零Hook”的底层实现与宿主通信全流程
android·前端·面试
The_era_achievs_hero42 分钟前
Flex布局属性
前端