闻心阁

一蓑烟雨看苍生,半壶浊酒笑红尘

uni-app 启用 tree-shaking

2020-04-14 约 1 分钟读完 搬砖秘籍

使用了uni-app cli开发小程序和 H5 的跨平台应用,打包代码的时候为了追求体积,尝试启用 tree-shaking ,按照 uni-app官方的说法,这项目功能是给 H5 平台用的,不过测试了一下,发现结果还不太一样,这里做一个记录。

H5 平台

mainfest.json 中添加如下的配置

"h5": {
  "optimization": {
    "treeShaking": {
      "enable": true
    }
  }  
}

这是不够的,还需要改babel.config.js

'@vue/app',
  {
    modules: false,//原来是commonjs
    useBuiltIns: process.env.UNI_PLATFORM === 'h5' ? 'usage' : 'entry'
  }

这样就可以启用 H5 平台的treeShaking,使用示例项目打包一下是可以的。

微信小程序平台

默认情况下,微信小程序平台是不行的,但在执行了上面的babel.config.js的修改之后,发现打包出来的vender.js中已经把没有引用到的函数给删除了,可以说是一个意外的惊喜了。

风险

目前上面的测试仅针对于示例登录项目的测试,修改此文件带来的其他风险暂时无法评估。