webpack集成Echarts问题

#1

由于echarts依赖zrender,但是zrender中npm已被占用,采用了url方式依赖:

"dependencies": {
    "zrender": "https://github.com/uooo/zrender/archive/2.1.1-webpack.tar.gz"
  }

还有其他好的方式吗?目前可以实现如下方式按需使用echarts:

npm install echarts@2.2.7-beta7
import echarts from 'echarts/src/echarts';
import 'echarts/src/chart/wordCloud';

let mychart = echarts.init(dom);
let charCloudOption = {...};
mychart.setOption(charCloudOption);
#2

不用打在一起,需要那几个就用官网上面那个生成就好了。

#3

@lobos
在npm中使用,如果老跑到官网打包,太麻烦了,目前我只弄成这种方式,经测试没问题了。还有没有其他好的方式?

#5

按照官网的方法在webpack中引入echarts 2.2.8 ,打包后虽然能够运行,但是项目目录中出现了很多bundle.js子文件

#6

正好我用来着,echarts是有 npm包的,直接npm install echats 就好了。然后你需要用什么图就去require那个文件。我记得当时在github上一个issue里看到有人这样设置了webpack:

resolve: {
alias: {
echarts$: “echarts/src/echarts.js”,
echarts: “echarts/src”,
zrender$: “zrender/src/zrender.js”,
zrender: “zrender/src”
}
}

然后就直接在JS文件里面require 比如 我使用了饼图,用到了tooltip 和 title
那么就该这样:

// echarts
var echarts = require(‘echarts’);
require(‘echarts/chart/pie’);
require(‘echarts/component/toolbox’);
require(‘echarts/component/tooltip’);
require(‘echarts/component/title’);

接着就可以进行初始化,像这样:

// 初始化pie
var echartsOne = document.getElementById(‘echart-main-1’);
var myChart = echarts.init(echartsOne);

最后myChart.setOption(option);
就好了

希望帮助到楼主

#7

笔误 npm install echarts

#8

http://git.hust.cc/echarts-for-react/#/echarts/simple?_k=jvns67

这个也许可以帮助~