背景
React Native第一個(gè)項(xiàng)目差不多完成,打算打包發(fā)布到出來(lái),用手機(jī)測(cè)試一下。那么就涉及四個(gè)步驟
- 使用外網(wǎng)后臺(tái)服務(wù)器 RN項(xiàng)目訪問(wèn)外網(wǎng)
- 打包RN項(xiàng)目
- 蘋果企業(yè)開發(fā)者賬號(hào)簽名
- CodePush, 熱更新RN項(xiàng)目
其中CodePush沒(méi)做,會(huì)在下一篇里面講到。這篇文章主要講2,3兩點(diǎn)。React Native官網(wǎng)上的資料真是少,簡(jiǎn)書上有關(guān)的文章,在我寫RN項(xiàng)目一路上也幫了我不少忙。今天我就參考了不少資料才完成。下面我就分享一下,希望能幫到遇到同樣情況的同學(xué)。
打包
主要參考這篇教程
創(chuàng)建離線包
把項(xiàng)目的所有js打包成一個(gè) "main.jsbundle",還有項(xiàng)目里用到的image打包進(jìn)assets。注意main.jsbundle和 assets的路徑。其他教程在這個(gè)地方有錯(cuò)誤。
react-native bundle --entry-file='index.ios.js' --bundle-output='./ios/MyAppName/main.jsbundle' --dev=false --platform='ios' --assets-dest='./ios'
導(dǎo)入main.jsbundle
用xcode打開RN項(xiàng)目,右擊項(xiàng)目,選擇"Add Files to...",選擇導(dǎo)入"./ios/MyApName/main.jsbundle"

導(dǎo)入assets
將"./ios/assets"目錄拖入xcode項(xiàng)目目錄,在彈出的選擇框中選擇"create folder references". 更多了解關(guān)于react native assets,請(qǐng)參考這篇教程

修改AppDelegate.m
如圖修改加載js路徑

測(cè)試
至少打包步驟完成,你可以用模擬器測(cè)試一下。可能有一些小錯(cuò)誤,重新運(yùn)行項(xiàng)目、卸載項(xiàng)目、關(guān)閉react native packager,總有一種辦法是生效的。
In House發(fā)布
由于我以前有HBuilder打包項(xiàng)目的經(jīng)驗(yàn),企業(yè)賬號(hào)打包的文件已經(jīng)準(zhǔn)備好,掃描下載的plist及安裝頁(yè)面完成,此篇教程就不講,有需要的請(qǐng)?jiān)u論,我看情況要不要寫一下。

安裝mobileprovision文件
雙擊企業(yè)開發(fā)者賬號(hào)的*. mobileprovision文件,即安裝
項(xiàng)目里選擇mobileprovision文件
項(xiàng)目名->Build Settings->Code Signning->Provision Profile,選擇剛剛安裝的mobileprovision名

修改info.plist的Bundle identifier
項(xiàng)目名->info.plist->Bundle identifier,修改的值是注冊(cè)Certificates時(shí)填入的值

創(chuàng)建iOS App .ipa文件
選擇目標(biāo)設(shè)備為"Generic iOS Device"
選擇菜單Product->Archive
然后就是導(dǎo)出.ipa嘍,其中有一步需要選擇apple id,登錄入自己的賬戶,選擇就行。

最后
好好學(xué)英語(yǔ)對(duì)技術(shù)的成長(zhǎng)有很大幫助。