1、安裝 CodePush cli

npm install -g code-push-cli

2、注冊CodePush賬號

code-push register 

會跳轉到一個網頁，注冊完畢后網頁會出現一串編碼，將編碼拷貝粘貼到剛剛的控制臺直接回車即可完成登錄。

3、登錄CodePush賬號
如果完成上面的全部操作則不需要再登錄，如若需要登錄

code-push login

4 、在CodePush內注冊App

code-push app add <ProjectName> ios react-native 

注冊成功會顯示如下

注冊key

其中Production 代表的是發(fā)布的版本。Staging 代表的是測試的版本。

5、JS代碼添加CodePush依賴

npm install --save react-native-code-push

6、iOS代碼Link CodePush

react-native link react-native-code-push

這個時候會讓你輸入deployment key ,直接回車就可以，在Xcode目錄下我們會進行配置的

7、在JS App.js 下面維護相應的代碼

import codePush from "react-native-code-push";
class App extends Component {

  componentDidMount(){
    codePush.sync({
        updateDialog:true,
        installMode:codePush.InstallMode.IMMEDIATE,
        mandatoryInstallMode:codePush.InstallMode.IMMEDIATE,
        deploymentKey:'6FSCurkj514C7gXkkQB9SSatIer04dc1704a-9251-460c-8f2d-54dea1abdc77',
    });

  }
}
export default codePush(App);

8、Xcode環(huán)境配置
由于debug環(huán)境是我們直接運行代碼，所以不需要設置熱更新，但要保證Xcode環(huán)境與CodePush環(huán)境保持一致，所以我們需要增加一個環(huán)境。
用Xcode 打開項目
-> Xcode的項目導航視圖中的PROJECT下選擇你的項目
-> 選擇Info頁簽
->在Configurations節(jié)點下單擊 + 按鈕
-> 選擇Duplicate "Release
-> 輸入Staging(名稱可以自定義)；

image.png

維護一個環(huán)境名稱，我這邊release 對應Production,Release Code對應Staging

9、然后在TARGET下 選擇Build Settings頁簽
-> 單擊 + 按鈕然后選擇添加User-Defined Setting
->>然后輸入CODEPUSH_KEY

image.png

如果你忘了你的key，可以通過該指令查看

code-push deployment ls <appName> -k

10、選擇Build Settings tab，搜索Build Location
-> Per-configuration Build Products Path
-> Release Code
修改原來的值，改成

$(BUILD_DIR)/Release$(EFFECTIVE_PLATFORM_NAME)

11、打開 Info.plist文件，
新建CodePushDeploymentKey列并在Value中輸入$(CODEPUSH_KEY)

image.png

12、修改Bundle versions為三位

image.png

13、修改AppDelegate.m中的代碼

#ifdef DEBUG
  jsCodeLocation = [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index" fallbackResource:nil];
#else
  jsCodeLocation = [CodePush bundleURL];
#endif

14、將App改為發(fā)布Release Code模式

image.png

15、在工程目錄下新建文件夾bundle,并在該文件夾下創(chuàng)建ios文件夾

16、打包
生成bundle命令 react-native bundle
--platform 平臺
--entry-file 啟動文件
--bundle-output 打包js輸出文件
--assets-dest 資源輸出目錄
--dev 是否調試

react-native bundle --entry-file index.js --bundle-output ./bundles/ios/index.ios.bundle --assets-dest ./bundles/ios/ --platform ios --dev false

可以將該指令維護到package.json里

這樣只需要每次運行 npm run build:ios 即可

17、上傳bundle至CodePush

code-push release-react Appname ios --t 1.0.0 --dev false --d Staging --des "<描述>" --m true

這時候重啟App即可看到提示

image.png