按需引入echarts元件

2021-10-25 18:31:32 字數 753 閱讀 3953

echarts元件非常多,有時候我們的業務就需要兩三個不多,這時候如果全部引入的就會導致打包過大,這時候就可以按需引入。

const echarts =

require

('echarts/lib/echarts');

// 引入折線圖

require

('echarts/lib/chart/line');

// 餅圖

require

('echarts/lib/chart/pie');

// 引入提示框和標題元件

require

('echarts/lib/component/tooltip');

require

('echarts/lib/component/title');

require

('echarts/theme/macarons'

)// 基於準備好的dom,初始化echarts例項

const mychart = echarts.

init

(document.

getelementbyid

('main'))

;// 繪製圖表

mychart.

setoption(,

tooltip:

, xaxis:

, yaxis:

, series:

});

echarts按需引入

這篇文章只對echarts v4.x 有效 官方更新到v5.x 後 可以檢視官方例項 檢視完整 按需引入 echarts 的完整包太大了,但是在專案中,其實很多都是用不上的,所以按需引入是很有必要的 import echarts from echarts lib echarts import ech...

Nuxt 中 按需引入 Element ui 元件

1.安裝 element ui npm i element ui s2.在根目錄下的plugins下建立element ui.js檔案,以下是我的檔案內容 import vue from vue import from element ui 引入分頁元件 vue.prototype.element ...

vant自動按需引入元件 推薦

通過 npm 安裝 npm i vant sbabel plugin import 是一款 babel 外掛程式,它會在編譯過程中將 import 的寫法自動轉換為按需引入的方式 安裝外掛程式 npm i babel plugin import d 在.babelrc 中新增配置 注意 webpac...