RN的分包研究借助开源项目

291 阅读1分钟

随着项目的逐渐增大,RN 分包也变得十分有用,也方便团队之间的协作。所以最近研究了下 RN 的分包,RN 的打包分为两个,除了原生的包,还需要将 RN 的代码打成 bundle 包,不同于web端使用 webpack 打包,RN 使用了自己开源的打包框架Metro,而且Metro也支持分包打包方式。此处不研究具体如何实现分布打包,只讲下原理。

假设我们要打一个基础包和一个业务包,下面我们假设有三个文件,分别是 index.js index2.js ceshi.js 这个三个分别是基础包入口,业务包入口,第三方依赖。index.js 和 index2.js 都依赖的 ceshi.js 。 所以我们想在打包时将 ceshi.js 打入基础包中,在打业务包时,就没有必要在打一次 ceshi.js 了。

好了现在问题就明了了,就是如何在打业务包时如何将 ceshi.js 这个依赖剔除掉。现在我们再假设,metro 在打包时可以为每个 js 文件也就是我们所说的 module 进行标记,每个js 文件都有一个唯一的 id ,metro 在打基础包是,我们将对应文件和对应 id 存起来。然后再打业务包时如果从基础包打包时存起来的 模块和id 对应文件里找到了这个依赖我们就不把它打进业务包即可。

目前上面的实现方法我们可以借助 metro 给我们暴露的方法 createModuleIdFactory 和 postProcessModulesFilter,我们只需要重写这两个方法即可,相关实现可参考 github.com/smallnew/re…