vue 项目中使用echarts 导致编译变慢_在Vue项目中使用ECharts

安装yarn add echarts vue-echarts引入import echarts from 'echarts'
如用TypeScript，还需安装yarn add --dev @types/echarts使用

<template>
  <Echart :options="polar"/>
</template>

<script lang="ts">
  import Vue from 'vue';
  import {Component} from 'vue-property-decorator';
  import ECharts from 'vue-echarts';
  import 'echarts/lib/chart/line';

@Component({
    components: {ECharts}
  })
  export default class Chart extends Vue {
   get polar(){
      return {
        xAxis: {
          type: 'category',
          data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
        },
        yAxis: {
          type: 'value'
        },
        series: [{
          data: [820, 932, 901, 934, 1290, 1330, 1320],
          type: 'line'
        }],
        tooltip: {show: true}
      }
    }
  }
</script>

<style lang="scss" scoped>
  .echarts {
    width: 100%;
    height: 100%;
  }
</style>

可得到折线图，具体图表样式的修改可参考ECharts官网。