用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應用的過程中遇到問題可以在本文的下方進行留言,我看到了后會及時回復的哦。