第一步：導(dǎo)出js bundle包和圖片資源：供打包離線使用
我們需要將JS部分的代碼和圖片資源等打包導(dǎo)出，然后通過XCode將其添加到iOS項目中。
導(dǎo)出js bundle的命令
在執(zhí)行打包命令之前，我們需要先確保在我們項目的根目錄有release_ios文件夾，沒有的話創(chuàng)建一個。此文件夾與RN項目下的ios與Android文件夾同等級。
然后RN項目的根目錄下執(zhí)行下面的命令
第一種:
react-native bundle --entry-file index.ios.js --platform ios --dev false --bundle-output release_ios/main.jsbundle --assets-dest release_ios/
--entry-file ,ios或者android入口的js名稱，比如index.js(老版本的RN項目的默認入口文件是index.ios.js)
--platform ,平臺名稱(ios或者android)
--dev ,設(shè)置為false的時候?qū)avaScript代碼進行優(yōu)化處理。
--bundle-output, 生成的jsbundle文件的名稱，比如release_ios/main.jsbundle (老版本的RN項目是區(qū)分iOS和android的，要改為index.ios.jsbundle)
--assets-dest 圖片以及其他資源存放的目錄,比如release_ios
第二種：
node node_modules/react-native/local-cli/cli.js bundle --entry-file index.js --platform ios --dev false --bundle-output ./ios/bundle/index.jsbundle --assets-dest ./ios/bundle
--entry-file ,ios或者android入口的js名稱，比如index.js(老版本的RN項目的默認入口文件是index.ios.js)
--platform ,平臺名稱(ios或者android)
--dev ,設(shè)置為false的時候?qū)avaScript代碼進行優(yōu)化處理。
--bundle-output, 生成的jsbundle文件的名稱，比如./ios/bundle/index.jsbundle (老版本的RN項目是區(qū)分iOS和android的，要改為index.ios.jsbundle)
--assets-dest 圖片以及其他資源存放的目錄,比如./ios/bundle
以上兩條命令各一條命令執(zhí)行完之后，會在release_ios文件夾下生成assets文件夾與main.jsbundle文件
其中，assets為項目中的JS部分所用到的圖片資源(不包括原生模塊中的圖片資源)，main.jsbundle是JS部分的代碼。
第二步：將js bundle包和圖片資源導(dǎo)入到iOS項目中
這一步我們需要用到XCode，選擇assets文件夾與main.jsbundle文件將其拖拽到XCode的項目導(dǎo)航面板中即可。如下圖所示
注：托文件的時候勾選第一與第三個勾選框，此步驟很重要，如下圖所示，使添加的文件夾為藍色
![]()
1597281458868.jpg
然后，修改AppDelegate.m文件，添加如下代碼
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
NSURL *jsCodeLocation;
//jsCodeLocation = [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index.ios" fallbackResource:nil];
+jsCodeLocation = [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];
#endif
...
return YES;
}
上述代碼的作用是讓React Native去使用我們剛才導(dǎo)入的jsbundle，這樣以來我們就擺脫了對本地nodejs服務(wù)器的依賴。
React Native Android打包詳解React Native Android打包，此處參考別人的
