React Native發佈APP之打包iOS應用

用React Native開發好APP以後，如何將APP發佈以供用戶使用呢？一款APP的發佈流程無外乎：簽名打包—>發佈到各store這兩大步驟。本文將向你們分享如何簽名打包一款React Native APP。

在本文中我將爲你們講解如何打包和發佈React Native iOS App。

第一步：導出js bundle包和圖片資源

和打包React Native Android應用不一樣的是，咱們沒法經過命令一步進行導出React Native iOS應用。咱們須要將JS部分的代碼和圖片資源等打包導出，而後經過XCode將其添加到iOS項目中。

導出js bundle的命令

在React Native項目的根目錄下執行：

1	react-native bundle --entry-file index.ios.js --platform ios --dev  false  --bundle-output release_ios/main.jsbundle --assets-dest release_ios/

經過上述命令，咱們能夠將JS部分的代碼和圖片資源等打包導出到release_ios目錄下：

生成jsbundle

其中，assets爲項目中的JS部分所用到的圖片資源(不包括原生模塊中的圖片資源)，main.jsbundle是JS部分的代碼。

在執行打包命令以前，咱們須要先確保在咱們項目的根目錄有release_ios文件夾，沒有的話建立一個。

第二步：將js bundle包和圖片資源導入到iOS項目中

這一步咱們須要用到XCode，選擇assets文件夾與main.jsbundle文件將其拖拽到XCode的項目導航面板中便可。

導入jsbundle

而後，修改AppDelegate.m文件，添加以下代碼：

1 2 3 4 5 6 7 8 9 10

- (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去使用咱們剛纔導入的jsbundle，這樣以來咱們就擺脫了對本地nodejs服務器的依賴。

提示：若是在項目中使用了CodePush熱更新，那麼咱們須要就能夠直接經過CodePush來讀取本地的jsbundle，方法以下：

1 2 3 4 5 6 7 8 9 10 11

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {    NSURL *jsCodeLocation;   #ifdef DEBUG      jsCodeLocation = [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@ "index.ios"  fallbackResource:nil]; #else      jsCodeLocation = [CodePush bundleURL]; #endif ...    return  YES; }

到目前爲止呢，咱們已經將js bundle包和圖片資源導入到iOS項目中，接下來咱們就能夠發佈咱們的iOS應用了。

第三步：發佈iOS應用

發佈iOS應用咱們須要有一個99美圓的帳號用於將App上傳到AppStore，或者是299美圓的企業級帳號用於將App發佈到本身公司的服務器或第三方公司的服務器。

接下來咱們就須要進行申請APPID ? 在Tunes Connect建立應用 ? 打包程序 ? 將應用提交到app store等幾大步驟。

由於官方文檔中有詳細的說明，在這我就再也不重複了。

若是，你們在打包發佈React Native iOS應用的過程當中遇到問題能夠在本文的下方進行留言，我看到了後會及時回覆的哦。