当前位置：首页 > news >正文

IoTSharp前端VUE采用npm run build编译提示require() of ES Module 出错

news 2025/11/16 5:22:02

IoTSharp前端代码在IoTSharp/ClientApp是采用VUE开发的代码，采用npm run build编译不通过，出现如下问题：

一、问题1：Error [ERR_REQUIRE_ESM]: require() of ES Module

IoTSharp前端代码ClientApp里用npm run build编译提示如下错语”The CJS build of Vite's Node API is deprecated. See https://vite.dev/guide/troubleshooting.html#vite-cjs-node-api-deprecated for more details. failed to load config from E:\IOT\IoTSharp\IoTSharp\ClientApp\vite.config.ts error during build: Error [ERR_REQUIRE_ESM]: require() of ES Module E:\IOT\IoTSharp\IoTSharp\ClientApp\node_modules\@iconify\utils\node_modules\package-manager-detector\dist\detect.mjs not supported. Instead change the require of E:\IOT\IoTSharp\IoTSharp\ClientApp\node_modules\@iconify\utils\node_modules\package-manager-detector\dist\detect.mjs to a dynamic import() which is available in all CommonJS modules.

这个错误表明在构建过程中，Vite 无法正确加载一个 ES Module（.mjs 文件），因为使用了 require()，而 ES Modules 不支持通过 require() 加载。

Vite 的 CJS 构建已被弃用，建议迁移到 ECMAScript Modules (ESM)。以下是两种解决方案：

1）解决方案：在 `package.json` 中添加 `"type": "module"`

在项目的 package.json 文件中添加 "type": "module"，这会告诉 Node.js 将 .js 文件作为 ESM 处理：

{"type": "module"
}

通过在 package.json 中添加 "type": "module" 或将 vite.config.ts 文件改名为 vite.config.mts，可以解决 Vite 的 CJS 构建弃用警告。通过动态导入 ES Modules、更新依赖项、清理和重新安装依赖、启用详细日志，通常可以解决 ERR_REQUIRE_ESM 错误。

二、问题2：vueSetupExtend is not a function

vite:config bundled config file loaded in 959.98ms +0ms failed to load config from E:\IOT\IoTSharp\IoTSharp\ClientApp\vite.config.ts error during build: TypeError: vueSetupExtend is not a function。

根据你的问题和提供的搜索结果，以下是解决 TypeError: vueSetupExtend is not a function 错误的详细步骤：

1）解决方案：安装`vite-plugin-vue-setup-extend组件`

错误信息表明 vueSetupExtend 被错误地导入或使用了。确保你正确导入了 vueSetupExtend 插件。根据搜索结果，vite-plugin-vue-setup-extend-plus 插件可能存在兼容性问题，建议使用 vite-plugin-vue-setup-extend