vue import echarts 报错

Question

在 hello.vue 中引入 echarts

会出现下面这种问题

而在 main.js 中引入则不会，这是为什么

Answer 1

这个是eslint的报错，原因楼上讲了，就是定义了变量但没有使用。
解决方法：
1.在后面的js中使用。
2.把eslint去掉，如果是用的vue-cli，可以在build文件夹下的webpack.base.conf.js里，去掉下面这一段就不会使用eslint监测代码了。

{
        test: /\.(js|vue)$/,
        loader: 'eslint-loader',
        enforce: 'pre',
        include: [resolve('src'), resolve('test')],
        options: {
          formatter: require('eslint-friendly-formatter')
        }
      }

Answer 2

。。。。你引用了 没有 使用么
在mounted 里写

var echarts = require('echarts');

// 基于准备好的dom，初始化echarts实例
var myChart = echarts.init(document.getElementById('main'));
// 绘制图表
myChart.setOption({
    title: { text: 'ECharts 入门示例' },
    tooltip: {},
    xAxis: {
        data: ["衬衫","羊毛衫","雪纺衫","裤子","高跟鞋","袜子"]
    },
    yAxis: {},
    series: [{
        name: '销量',
        type: 'bar',
        data: [5, 20, 36, 10, 10, 20]
    }]
});

Answer 3

你这里是严格模式，这个组件里面没有用echarts，

Answer 4

这个报错其实不怎么需要理会。
就是严格模式下一个变量定义了却不被引用就会报错提示，但是其实你实际使用了echarts之后就不会有这个问题出现了。

Answer 5

你引用了，但是下面没有用到。最简单的方法就是

  import echarts from 'echarts' 
  export default {
    name: '',
    echarts, //这里
    data () {
      return {}
    }
  }