欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

vite打包出現(xiàn)?"default"?is?not?exported?by?"node_modules/...問題解決辦法

 更新時間:2024年06月04日 09:12:15   作者:狂野小青年  
這篇文章主要給大家介紹了關(guān)于vite打包出現(xiàn)?"default"?is?not?exported?by?"node_modules/...問題的解決辦法,文中通過代碼將解決的辦法介紹的非常詳細,對同樣遇到這個問題的朋友具有一定的參考借鑒價值,需要的朋友可以參考下

項目場景:

vue3+ts+vite項目打包

問題描述

// codemirror 編輯器的相關(guān)資源
import Codemirror from 'codemirror';

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:...

原因分析:

報錯意思是導(dǎo)入的js文件沒有默認導(dǎo)出

解決方案:

有兩種方法

1.修改node_modoules下的文件源碼

在前面加上expoert default

export default (function (global, factory) {
  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
    typeof define === 'function' && define.amd ? define(factory) :
      (global = global || self, global.CodeMirror = factory());
}(this, (function () {
  'use strict';

為這個js文件添加一個默認導(dǎo)出

不太推薦這個方法,雖然比較簡單

2.安裝@rollup/plugin-commonjs插件,vite-plugin-require-transform插件

@rollup/plugin-commonjs可以將commonjs模塊轉(zhuǎn)換層es6模塊

但只會對require生效

所以需要將導(dǎo)入改為require格式

(1)安裝插件

npm i @rollup/plugin-commonjs
npm i vite-plugin-require-transform

(2)添加配置

在vite.config.ts配置中添加插件,注意commonjs()必須在上面,否則可能不生效

import { defineConfig } from 'vite';
import vue from '@vitejs/plugin-vue';
import commonjs from '@rollup/plugin-commonjs';//引入commojs
import requireTransform from 'vite-plugin-require-transform';//引入require
export default defineConfig({
  plugins: [
    commonjs() as any,
    //我的入口文件是ts類型,所以下面必須加上.ts$,否則在main.ts無法使用require
    requireTransform({
      fileRegex: /.js$|.vue$|.png$|.ts$|.jpg$/
    }) //配置require
    vue(),
  ],
 }

(3)將main.ts中的導(dǎo)入改為require

// codemirror 編輯器的相關(guān)資源
const Codemirror = require('codemirror');

總結(jié) 

到此這篇關(guān)于vite打包出現(xiàn) "default" is not exported by "node_modules/...問題解決辦法的文章就介紹到這了,更多相關(guān)vite打包default is not exported by node_modules/...內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!

相關(guān)文章

  • 詳解Vue.js3.0 組件是如何渲染為DOM的

    詳解Vue.js3.0 組件是如何渲染為DOM的

    這篇文章主要介紹了詳解Vue.js3.0 組件是如何渲染為DOM的 ,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧
    2020-11-11
  • vue3中v-model的用法詳解

    vue3中v-model的用法詳解

    vue 提供了很多自定義指令,大大方便了我們的開發(fā),其中最常用的也就是 v-model,他可以在組件上使用以實現(xiàn)雙向綁定。它可以綁定多種數(shù)據(jù)結(jié)構(gòu), 今天總結(jié)一下用法
    2023-04-04
  • VsCode里的Vue模板的實現(xiàn)

    VsCode里的Vue模板的實現(xiàn)

    這篇文章主要介紹了VsCode里的Vue模板的實現(xiàn),文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧
    2020-08-08
  • Vue監(jiān)聽localstorage變化的方法詳解

    Vue監(jiān)聽localstorage變化的方法詳解

    在日常開發(fā)中,我們經(jīng)常使用localStorage來存儲一些變量,這些變量會存儲在瀏覽中,對于localStorage來說,即使關(guān)閉瀏覽器,這些變量依然存儲著,方便我們開發(fā)的時候在別的地方使用,本文就給大家介紹Vue如何監(jiān)聽localstorage的變化,需要的朋友可以參考下
    2023-10-10
  • 簡述vue中的config配置

    簡述vue中的config配置

    這篇文章主要介紹了vue中的config配置 ,本文給大家介紹的非常詳細,具有參考借鑒價值,需要的朋友可以參考下
    2018-01-01
  • vue實現(xiàn)表單未編輯或未保存離開彈窗提示功能

    vue實現(xiàn)表單未編輯或未保存離開彈窗提示功能

    這篇文章主要介紹了vue實現(xiàn)表單未編輯或未保存離開彈窗提示功能,本文通過實例代碼給大家介紹的非常詳細,對大家的學習或工作具有一定的參考借鑒價值,需要的朋友可以參考下
    2020-04-04
  • 用vue寫一個日歷

    用vue寫一個日歷

    這篇文章主要介紹了如何利用vue寫一個日歷,幫助大家更好的理解和學習vue,感興趣的朋友可以了解下
    2020-11-11
  • vue.js項目nginx部署教程

    vue.js項目nginx部署教程

    nginx是一個高性能的HTTP和反向代理服務(wù)器。這篇文章主要介紹了vue.js項目nginx部署,需要的朋友可以參考下
    2018-04-04
  • vue+elemen實現(xiàn)el-tooltip在文本超出區(qū)域后浮現(xiàn)

    vue+elemen實現(xiàn)el-tooltip在文本超出區(qū)域后浮現(xiàn)

    el-tooltip組件本身就是懸浮提示功能,在對它進行二次封裝時,實現(xiàn)超出的文本浮現(xiàn),本文就來介紹一下vue+elemen實現(xiàn)el-tooltip在文本超出區(qū)域后浮現(xiàn),感興趣的可以了解一下
    2023-12-12
  • Vue2+JS實現(xiàn)掃雷小游戲

    Vue2+JS實現(xiàn)掃雷小游戲

    實現(xiàn)小游戲可以鍛煉自己的邏輯思維能力,也不會很枯燥,完成時會給自己帶來一種滿足感。本文就將利用Vue和JS實現(xiàn)簡單的掃雷小游戲,需要的可以參考一下
    2022-06-06

最新評論