解决在nuxt中局部单独引入echarts

首先如果全部引入echarts的话，下载的包有10G左右，打包项目完全会有问题。

所以我们只要引入自己需要的组件就可以了。

作者项目中只用到了线性功能，所以进入到echarts官网 在线定制 ：https://echarts.apache.org/zh/builder.html

勾选你需要的功能，然后下载，压缩包之后得到 echarts.min.js ,这样文件只需200K左右。

然后把 echarts.min.js 丢到 static 文件夹下：

最后配置 nuxt.config.js ： 

script: [{src: 'echarts.min.js', async: true, defer: true}] （这样就引入完成了）

最后写一个线性图组件：

源码附上：跟后台商量一下，返回的所有格式必须 数组： [100,200,300,400,500] 这种数据格式

    #myChart {

        width: 100%;

        height: 300px;

        margin-left: auto;

        margin-right: auto;

        float: left;

    }

最后效果：因为接口数据为空 所以 线性图没有出来。

但是作者还是碰到了一个bug：刷新页面会出来 路由后面跟echarts的js文件。希望知道这个问题的小伙伴告诉我一下。

最后作者解决了上图的问题，就是把 echarts.min.js  放到js文件夹下面就行了，不能直接放static文件夹下。