vite打包出现"default" is not exported by "node_modules/...问题解决

 更新时间:2023年11月28日 10:05:09   作者:AB12543  
这篇文章主要给大家介绍了关于vite打包出现"default" is not exported by "node_modules/...问题解决的相关资料,文中通过代码介绍的非常详细,需要的朋友可以参考下

项目场景:

vue3+ts+vite项目打包

问题描述

error during build:
RollupError: "default" is not exported by "node_modules/vue/dist/vue.runtime.esm-bundler.js", imported by "node_modules/@kangc/v-md-editor/lib/codemirror-editor.js".
    at error (file:///D:...

原因分析:

vite不支持commonjs语法,需要使用@rollup/plugin-commonjs插件,用于将CommonJS模块转换为ES6模块的Rollup插件。

解决方案:

1.安装@rollup/plugin-commonjs插件

npm i @rollup/plugin-commonjs

2.在vite.config.ts配置中添加该插件,注意commonjs()必须在上面,否则可能不生效,我排查了老半天

import { defineConfig } from 'vite';
import vue from '@vitejs/plugin-vue';
import commonjs from '@rollup/plugin-commonjs';//引入commojs

export default defineConfig({
  plugins: [
    commonjs() as any,
    vue(),
  ],
 }

总结 

到此这篇关于vite打包出现"default" is not exported by "node_modules/...问题解决的文章就介绍到这了,更多相关vite打包问题解决内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • Vue移动端下拉刷新组件的使用教程

    Vue移动端下拉刷新组件的使用教程

    这篇文章主要介绍了Vue移动端下拉刷新组件的使用教程,每一次我在使用vant组件库里面list组件和下拉刷新连在一起用的时候都会出现下拉刷新和列表下滑局部滚动的冲突,这就很难受,这篇文章将解决它
    2023-04-04
  • vue-cli 目录结构详细讲解总结

    vue-cli 目录结构详细讲解总结

    这篇文章主要介绍了vue-cli 目录结构详细讲解总结,详细的介绍了整个项目的目录以及目录文件的用法,非常具有实用价值,需要的朋友可以参考下
    2019-01-01
  • vue中如何给静态资源增加路由前缀

    vue中如何给静态资源增加路由前缀

    这篇文章主要介绍了vue中如何给静态资源增加路由前缀,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2022-12-12
  • vue使用threeJs导入obj模型并实现添加标注

    vue使用threeJs导入obj模型并实现添加标注

    这篇文章主要介绍了vue使用threeJs导入obj模型并实现添加标注方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
    2024-05-05
  • Vue如何调用接口请求头增加参数

    Vue如何调用接口请求头增加参数

    这篇文章主要介绍了Vue如何调用接口请求头增加参数,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2023-01-01
  • Vue将将后端返回的list数据转化为树结构的实现

    Vue将将后端返回的list数据转化为树结构的实现

    本文主要介绍了Vue将将后端返回的list数据转化为树结构的实现,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2022-05-05
  • Vue中fragment.js使用方法小结

    Vue中fragment.js使用方法小结

    这篇文章主要给大家汇总介绍了Vue中fragment.js使用方法的相关资料,需要的朋友可以参考下
    2020-02-02
  • 在原生HTML中使用VUE的保姆级教学

    在原生HTML中使用VUE的保姆级教学

    Vue.js是一种流行的JavaScript框架,用于构建交互式的Web应用程序,这篇文章主要给大家介绍了关于在原生HTML中使用VUE的保姆级教学,需要的朋友可以参考下
    2023-10-10
  • Vue.js 前端项目在常见 Web 服务器上的部署配置过程

    Vue.js 前端项目在常见 Web 服务器上的部署配置过程

    Web服务器支持多种编程语言,如 PHP,JavaScript,Ruby,Python 等,并且支持动态生成 Web 页面,这篇文章主要介绍了Vue.js 前端项目在常见 Web 服务器上的部署配置,需要的朋友可以参考下
    2023-02-02
  • vue使用中的内存泄漏【推荐】

    vue使用中的内存泄漏【推荐】

    内存泄露是指new了一块内存,但无法被释放或者被垃圾回收。这篇文章主要介绍了vue使用中的内存泄漏,需要的朋友可以参考下
    2018-07-07

最新评论