一、Native本地加載流程
1.1蝶溶、React應(yīng)用打包
- 1膝蜈、導(dǎo)出
.jsbundle包和圖片資源
// 根項(xiàng)目下乙漓，即index.js所在文件夾
mkdir out
cd out
mkdir ios
mkdir android
// iOS
npx react-native bundle --entry-file index.js --bundle-output ./out/ios/index.ios.bundle --platform ios --assets-dest ./out/ios --dev false
// android
npx react-native bundle --platform android --dev false --entry-file index.js --bundle-output ./out/android/index.android.bundle --assets-dest ./out/android
生成.jsbundle（js部分的代碼） 和 assets 文件夾 （項(xiàng)目所用到的資源）
2唬滑、將
.jsbundle和assets 文件夾導(dǎo)入項(xiàng)目Native工程告唆。
注意導(dǎo)入assets文件夾的時(shí)候，options選擇Create folder refrences晶密，否則RN應(yīng)用會(huì)應(yīng)用不到資源。3模她、Native加載（iOS為例）
NSURL *url = [[NSBundle mainBundle] URLForResource:@"index.ios.bundle" withExtension:nil];
RCTRootView *rootView = [[RCTRootView alloc] initWithBundleURL:url moduleName:@"HelloFirstRNDemo" initialProperties:nil launchOptions:nil];
1.2稻艰、react-native的命令詳解
Options:
-h, --help 輸出如何使用的信息
--entry-file <path> RN入口文件的路徑, 絕對(duì)路徑或相對(duì)路徑
--platform [string] ios 或 andorid
--transformer [string] Specify a custom transformer to be used
--dev [boolean] 如果為false, 警告會(huì)不顯示并且打出的包的大小會(huì)變小
--prepack 當(dāng)通過(guò)時(shí), 打包輸出將使用Prepack格式化
--bridge-config [string] 使用Prepack的一個(gè)json格式的文件__fbBatchedBridgeConfig 例如: ./bridgeconfig.json --bundle-output <string> 打包后的文件輸出目錄, 例: /tmp/groups.bundle
--bundle-encoding [string] 打離線包的格式 可參考鏈接https://nodejs.org/api/buffer.html#buffer_buffer.
--sourcemap-output [string] 生成Source Map，但0.14之后不再自動(dòng)生成source map侈净，需要手動(dòng)指定這個(gè)參數(shù)尊勿。例: /tmp/groups.map --assets-dest [string] 打包時(shí)圖片資源的存儲(chǔ)路徑
--verbose 顯示打包過(guò)程
--reset-cache 移除緩存文件
--config [string] 命令行的配置文件路徑
--bundle-output bundle文件輸出路徑
--assets-dest 靜態(tài)資源文件輸出路徑
1.3、關(guān)于metro
metro是一種支持ReactNative的打包工具畜侦，也可以基于它來(lái)進(jìn)行拆包的元扔。
react-native metro 分析
- 加載包提示
Connect to Metro to develop JavaScript
