1 概述
環境
Vue3
+
Vite
，需要引入
ECharts
庫。
2 嘗試
目前
ECharts
已更新到
5.0
版本，在
Vue
中引入并不難，
npm
/
cnpm
安裝後在需要的元件中引入：
import echarts from 'echarts'
即可。
但，
問題是這是以前的版本可行的，更新到
5.0
版本後需要使用其他方法。
另一方面官方文檔是使用
require
引入：
但是，這是在
Webpack
的情況下，在
Vite
中并不能直接使用
require
，官方
issue
有讨論，明說了
require
不支援，這是一個
Node
的特性，建議使用
import
：
3 解決方案
先安裝：
npm install --save echarts
#或
cnpm install --save echarts
安裝後在需要使用的元件中使用
import
import * as echarts from 'echarts'
...
mounted(){
var myChart = echarts.init(document.getElementById('main'))
//...
}
這樣就能正常使用了。
最重要的就是将以前的
import echarts from 'echarts'
改為
import * as echarts from 'echarts'