Vue中使用 Echarts5.0 遇到的一些問題(vue-cli 下開發(fā))
Vue使用Echarts5.0的一些問題
問題
最新版的 Echarts5.0 使用 import echarts from 'echarts' 導入,會發(fā)現(xiàn)導出的 echarts 是 undefined 的情況,無法正常使用。
解決方案一
新版本有問題就用舊版本咯
# 卸載 Echarts5.0 npm uninstall echarts # 規(guī)定版本來安裝(選擇自己喜歡的版本安裝) npm install echarts@4.8.0 --save ?# 導入使用 import echarts from 'echarts'
解決方案二
還是使用 Echarts5.0 但是導入方式換為:
import * as echarts from 'echarts'
為什么會出現(xiàn)這種情況?
對比一下 源碼就知道咯,5.0 版本的 dist 目錄多了個 .esm.js 文件 ,之前的版本是沒有的,這是個特意給 ESM 模塊導入使用的,截圖如下,所以以前的導入方法就不行咯,因為使用了 export 而不是 export default (可以去了解下 ESM,就知道這兩個導出有啥區(qū)別了)

vue使用echarts 5.0“export ‘default‘ (imported as ‘echarts‘) was not found in ‘echarts‘
有原來的引入方式改為
import ?* as echarts from "echarts"
以上為個人經(jīng)驗,希望能給大家一個參考,也希望大家多多支持腳本之家。
相關文章
使用ElementUI el-upload實現(xiàn)一次性上傳多個文件
在日常的前端開發(fā)中,文件上傳是一個非常常見的需求,尤其是在用戶需要一次性上傳多個文件的場景下,ElementUI作為一款非常優(yōu)秀的Vue.js 2.0組件庫,為我們提供了豐富的UI組件,本文介紹了如何使用ElementUI el-upload實現(xiàn)一次性上傳多個文件,需要的朋友可以參考下2024-08-08
使用elementUI table展開行內(nèi)嵌套table問題
這篇文章主要介紹了使用elementUI table展開行內(nèi)嵌套table問題,具有很好的參考價值,希望對大家有所幫助。如有錯誤或未考慮完全的地方,望不吝賜教2023-04-04
Vue通過自定義指令實現(xiàn)內(nèi)容替換的示例代碼
這篇文章主要介紹了利用Vue通過自定義指令實現(xiàn)內(nèi)容替換的方法,通過Vue.directive指令定義函數(shù)來實現(xiàn)內(nèi)容自定義,通過指令定義函數(shù)的三個鉤子函數(shù)(inserted、componentUpdated、unbind)來實現(xiàn)自定義內(nèi)容的掛載、更新和銷毀,需要的朋友可以參考下2025-03-03
vue中el-table實現(xiàn)可拖拽移動列和動態(tài)排序字段
最近公司需要做個項目,需要拖拽表格和自定義表格字段,本文主要介紹了vue中el-table實現(xiàn)可拖拽移動列和動態(tài)排序字段,具有一定吃參考價值,感興趣的可以了解一下2023-12-12
vue中el-table實現(xiàn)自動吸頂效果(支持fixed)
本文主要介紹了vue中el-table實現(xiàn)自動吸頂效果,文中通過示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下2021-09-09

