如果React Native开发, 即使没有功能性代码,生成的JSBundle文件也要300KB左右。 随着功能的增加,最终难免要考虑JSBundle拆分的工作。
现在Web开发中,主流的拆分JS的工具就是WebPack,它能否用于RN呢?
答案是默认是不能的,但是也有些三方的库帮你实现通过WebPack实现拆分Bundle。
至于原因可以参考:
ReactNative本身提供了一个ReactNative Packager 功能。介绍 RN-Packager。
如何使用呢?
reactnative bundle 命令通过 --manifest-output 参数可以生成一个包含依赖的 manifest.json文件.
然后打其他bundle的时候通过--manifest-file 参数,就可以跳过 manifest.json中包含的依赖。
例子:
//打一个包含公共的基础的JS库的库: base.android.bundle
//同时会生成base.android.manifest.json,里面保存了当前库已经打进的依赖库
react-native bundle --entry-file ./base.android.js --platform android --bundle-output ./output/base.android.bundle --manifest-output ./output/base.android.manifest.json
//打一个index.android.bundle,它依赖base.android.bundle,但不包含base.android.manifest.json中已有的依赖
react-native bundle --entry-file ./index.android.js --platform android --bundle-output ./output/index.android.bundle --manifest-file ./output/base.android.manifest.json
写在最后:
目前RN工程太小,并没有去尝试拆分bundle,我只是记录一下而已,呵呵。