在项目中引入 ECharts

npm安装 ECharts

npm install echarts --save

引入 ECharts

单页面引入

import * as echarts from 'echarts';

全局引入（main.js）

import * as echarts from 'echarts';
Vue.prototype.$echarts = echarts

使用

<div ref="myChart" id="myChart" class="main_container"></div>

.main_container {
    width: 100%;
    height: 400px;
}

mounted() {
    this.initCharts()
},
initCharts() {
    // refs获取元素（两种任选其一）
    const chartDom = this.$refs['myChart'];
    // id获取元素 
    const chartDom = document.getElementById('main')
    if(chartDom){
        // 单页面的方式（两种任选其一）
        var myChart = echarts.init(chartDom);
        // 全局引用的方式
        var myChart = this.$echarts.init(chartDom);
        // 绘制图表
        myChart.setOption({
            title: {
                text: 'ECharts 入门示例'
            },
            tooltip: {},
            xAxis: {
                data: ['衬衫', '羊毛衫', '雪纺衫', '裤子', '高跟鞋', '袜子']
            },
            yAxis: {},
            series: [
                {
                    name: '销量',
                    type: 'bar',
                    data: [5, 20, 36, 10, 10, 20]
                }
            ]
        });
    }
},

成功是这样的