react native 如何打包生成Js Bundle文件（以android 为例）

一、准备条件

android工程中已经创建assets/index.android.bundle 文件

二、在react native中输入命令打Bundle包

打包命令说明：

react-native bundle [参数]
  构建 js 离线包 

  Options:

    -h, --help                   输出如何使用的信息
    --entry-file <path>          RN入口文件的路径, 绝对路径或相对路径
    --platform [string]          ios 或 andorid
    --transformer [string]       Specify a custom transformer to be used
    --dev [boolean]              如果为false, 警告会不显示并且打出的包的大小会变小
    --prepack                    当通过时, 打包输出将使用Prepack格式化
    --bridge-config [string]     使用Prepack的一个json格式的文件__fbBatchedBridgeConfig 例如: ./bridgeconfig.json
    --bundle-output <string>     打包后的文件输出目录, 例: ./android/app/src/main/assets/index.android.bundle
    --bundle-encoding [string]   打离线包的格式 可参考链接https://nodejs.org/api/buffer.html#buffer_buffer.
    --sourcemap-output [string]  生成Source Map，但0.14之后不再自动生成source map，需要手动指定这个参数。例: /tmp/groups.map
    --assets-dest [string]       打包时图片资源的存储路径
    --verbose                    显示打包过程
    --reset-cache                移除缓存文件
    --config [string]            命令行的配置文件路径

命令如下👇

react-native bundle --entry-file index.js --platform android --dev false --bundle-output ./android/app/src/main/assets/index.android.bundle --assets-dest ./android/app/src/main/res/

注意如果你的android 工程assets下没有index.android.bundle 此文件那么会提示写入错误 如下图

打包成功之后可以使用beyond compare工具对比android 目录下的变动

会发现除了assets目录是开发者主动新建的其余目录则由打包时自动生成。

index.android.bundle里面包含了所有js代码（RN源码、第三方库代码和自己的业务代码）

参考
https://blog.csdn.net/qq_23621841/article/details/81207666
https://zhuanlan.zhihu.com/p/52357602