。
- 发布:2026-04-01 10:23
- 更新:2026-04-01 10:26
- 阅读:43
【报Bug】unplugin-auto-import/vite" resolved to an ESM file. ESM file cannot be loaded by `require`
产品分类: uniapp/H5
PC开发环境操作系统: Windows
PC开发环境操作系统版本号: windows11
HBuilderX类型: 正式
HBuilderX版本号: 5.05
浏览器平台: Chrome
浏览器版本: 版本 117.0.5938.150(正式版本)(64 位)
项目创建方式: HBuilderX
操作步骤:
预期结果:
。
。
实际结果:
X [ERROR] "unplugin-auto-import/vite" resolved to an ESM file. ESM file cannot be loaded by require.
X [ERROR] "unplugin-auto-import/vite" resolved to an ESM file. ESM file cannot be loaded by require.
bug描述:
采用 “可视化” 模式创建了一个新的项目( vue3 + ts + 组合式API)
本来准备像vscode项目那样,引入:unplugin-auto-import,以便在每个页面自动导入一些常用的工具和类型,比如:vue、uni-app、@/utils/request 等。。。
然后直接报错了:
X [ERROR] "unplugin-auto-import/vite" resolved to an ESM file. ESM file cannot be loaded by require.
按AI的方案尝试处理,包括【重新安装插件、修改名称为vite.config.mts、指定type=module】都解决不了问题!
我想问官方:
1,是不支持自动导入的搞法吗(unplugin-auto-import)?
2,网上有帖子说:
【现代前端工具如Vite、Unocss已全面转向ES模块,而一些老牌框架如Uniapp的部分依赖仍停留在CommonJS时代。】
我想问:是真的吗?uni-app是【老牌停留在commonJS时代】??
3,安装uni-app Vite 插件的命令是什么?
npm install -D @dcloudio/vite-plugin-uni?
npm install -D @dcloudio/vite-plugin-uni@latest?
找遍了整个uni-app官网,好像都没找到这个命令和版本说明
4,最后的选择
“vue3 + ts + 组合式API”的项目,到底是应该“可视化”创建项目好?还是 CLI创建项目好?
希望能收到uni工程师的回复,谢谢。
1 个回复
Ask小助手 - Ask社区AI助手
作为DCloud官方人员,对该bug反馈的评审如下:
一、反馈内容完整性评审
不足之处:
vite.config.js/vite.config.ts的具体配置内容、package.json依赖列表,官方无法判断具体的引入方式和配置是否正确已有信息:
require建议补充:
请提供完整的
vite.config.ts配置文件内容、package.json中的type字段设置,以及具体的运行命令(如npm run dev:h5或HBuilderX菜单操作路径)。二、Bug是否成立分析
根据知识库检索,该问题可能并非uni-app内核bug,而是配置或使用方式问题:
unplugin-auto-import 支持情况:知识库中vitesse-uni模板明确使用了
unplugin-auto-import插件,说明uni-app Vue3+Vite项目支持该插件。ESM支持情况:uni-app Vue3项目基于Vite,完全支持ESM。知识库中vite-config-1明确说明
vite.config.js是ESM格式,使用import/export语法。错误原因推测:"ESM file cannot be loaded by require"通常出现在:
"type": "module"且配置文件名为.js而非.mjs/.ts三、用户问题解答
基于知识库内容,回答您的4个问题:
1. 是否支持unplugin-auto-import?
支持。插件市场模板vitesse-uni已集成该插件,可实现Composition API等自动导入。
2. uni-app是否停留在CommonJS时代?
不是。uni-app Vue3/Vite项目已全面支持ESM。知识库明确说明Vue3项目使用Vite构建工具,配置文件
vite.config.js采用ESM语法(import/export)。Vue2项目使用Webpack,但Vue3项目完全是现代ESM架构。3. 安装uni-app Vite插件的命令?
知识库中vite-config-1显示需安装
@dcloudio/vite-plugin-uni,但具体install命令在知识库中未明确记录。通常命令为:4. 可视化 vs CLI创建项目?
两种方式都支持Vue3+TS+组合式API:
建议:如需使用大量第三方Vite插件,建议使用CLI方式创建项目,因为可视化创建的项目在HBuilderX内部运行时的Node环境可能与某些ESM-only插件存在兼容性问题。
四、解决方案建议
vite.config.ts改为vite.config.mts,或在package.json中设置"type": "module"如问题持续,请提供完整的配置文件内容和package.json,以便进一步排查。
要回复问题请先登录或注册
公告
更多>相关问题