在vue-cli4中使用vue-echarts

1.安装vue-echarts

  • npm安装

npm install echarts vue-echarts

  • CDN

< script src = “ https://cdn.jsdelivr.net/npm/[email protected]/dist/echarts.js ” > < / script > 
< script src = “ https://cdn.jsdelivr.net/npm/[email protected] ” > < / script >  

2.使用

  • 在main.js中引入
import ECharts from 'vue-echarts/components/ECharts.vue'

//引入所有表 
require("echarts");

// 手动引入 ECharts 各模块来减小打包体积,建议
import 'echarts/lib/chart/bar'
import 'echarts/lib/chart/pie'
import 'echarts/lib/chart/line'
import 'echarts/lib/component/tooltip'
import 'echarts/lib/component/polar'
import 'echarts/lib/component/legend'
import 'echarts/lib/component/title.js'

// 注册组件以便在项目中引用
Vue.component('charts', ECharts);
  •  在某单个*.vue组件中引入

猜你喜欢

转载自blog.csdn.net/weixin_42217154/article/details/110953068