Node.js/Express.js项目集成Swagger UI时JSON导入报错如何解决

你项目的package.json中配置了"type": "module"，使用Node.js原生ES模块规范，该规范默认不支持直接导入.json后缀的文件，因此抛出ERR_UNKNOWN_FILE_EXTENSION错误。

按以下步骤修改即可解决报错，同时实现你要求的文档访问路径：

步骤1：修改swagger配置文件导入方式（优先推荐，无实验性特性依赖） #

替换server.js中导入swagger.json的代码，改用文件读取+JSON解析的方式加载配置：

// 删掉原来的 import swaggerDocument from "./swagger.json"
// 新增fs模块导入，读取解析swagger配置
import fs from 'fs'
const swaggerDocument = JSON.parse(fs.readFileSync('./swagger.json', 'utf-8'))

步骤2：修改Swagger UI挂载路径 #

将server.js中原先挂载Swagger UI的代码路径从/api_docs改为你需要的/challenge/docs：

// 删掉原来的 app.use("/api_docs", swaggerUi.serve, swaggerUi.setup(swaggerDocument));
// 替换为以下代码
app.use("/challenge/docs", swaggerUi.serve, swaggerUi.setup(swaggerDocument));

可选替代方案（不推荐生产环境使用） #

如果不想修改导入代码，也可以在启动命令中添加JSON模块导入的实验性参数，修改package.json的scripts配置：

"scripts": {
  "dev": "nodemon --experimental-json-modules server.js",
  "build": "node --experimental-json-modules server.js"
}

修改完成后执行npm run dev启动项目，直接访问http://localhost:5000/challenge/docs即可正常打开Swagger API文档。

内容的提问来源于stack exchange，提问作者Diego Davincci