Taro小程序中使用ec-charts包体积过大

在Taro中使用ec-charts打包预览的时候发现包体积太大,研究了一下,有两种解决方案

方案一:

  通过编译配置,打包时跳过echarts.js的编译,配置文件是config/index.js,config/prod.js文件中添加如下配置

 mini: {
    ...
    compile: {
      exclude: [
        path.resolve(__dirname, '..', 'src/package1/pages/bim/grow_chart/ec-canvas/echarts.js')
      ]
    },
    webpackChain(chain) {
      chain.merge({
       optimization: {
        splitChunks: {
         cacheGroups: {
          [DeviceEchartsChunkName]: {
           name: DeviceEchartsChunkName,
           priority: 50,
           test(module) {
            return /package1[\/]pages[\/]bim[\/]grow_chart[\/]ec-canvas[\/]echarts.js/.test(
             module.resource
            );
           },
          },
         },
        },
       },
      });
    },
    addChunkPages(pages, pagesNames) {
      // pages.set("package1/pages/bim/grow_chart/index", [DeviceEchartsChunkName]);
      pages.set("package1/pages/bim/grow_chart/ec-canvas/ec-canvas", [DeviceEchartsChunkName]);
    }
    ...
  },

使用这种方式是由问题的, 真机预览的时候图标就加载不出来了,

二、 这是最简单快捷的方式,如果你需要绘制的图标类型比较小就很推荐

我们可以到echarts官网去定制echarts.js文件, 定制地址: https://echarts.apache.org/zh/builder.html

勾选你需要的功能,下载下来,然后将ec-canvas/echarts.js的文件替换掉就可以了

原文地址:https://www.cnblogs.com/zhang-jiao/p/14453004.html