报错信息

报错信息
报错信息:The requested module ‘/node_modules/axios/index.js?v=2866e624’ does not provide an export named ‘default’

现象

使用 vite 打包工具开发时出现,生产环境正常

原因

原因在于 Vite 是完全依靠 ESM 原生能力的,也就是他只认识 import ,因为 Vite 依赖 scriptmodule 属性。
我们的代码最终都会被送到浏览器里执行,requirecjs 的关键词,浏览器环境本身就没定义这个方法,自然就报错了。
这里和 webpack 不一样,webpack 把文件送到浏览器之前是会进行预打包的,这时候已经将 require 转换成 浏览器能兼容的方法了。
出现上述报错的原因可能是依赖中通过import导入一个ES6模块,但是这个ES6模块中使用了require,当Vite去构建的时候,发现是采用import导入的就不会预编译,从而报错。
查看原文

解决方法

使用一个捆绑的 axioses 模块
@bundled-es-modules/axios 说明文档

 npm i @bundled-es-modules/axios
// 引入
import { axios } from 'axios';

其他解决方案

import axios 导致 vue v3 和 vite 出现问题

Logo

基于 Vue 的企业级 UI 组件库和中后台系统解决方案,为数万开发者服务。

更多推荐