codePush 安裝
安裝codePush CLI
安裝CodePush指令，直接在終端上輸入如下命令即可，注意：這個(gè)CodePush指令只需要全局安裝一次即可，如果第一次安裝成功了，那后面就不在需要安裝
npm install -g code-push-cli
注冊(cè) CodePush賬號(hào)
code-push register
注意：當(dāng)執(zhí)行完上面的命令后，會(huì)自動(dòng)打開一個(gè)授權(quán)網(wǎng)頁，讓你選擇使用哪種方式進(jìn)行授權(quán)登錄 推薦使用gitHub
注冊(cè)成功后會(huì)有一個(gè)key
把這個(gè)KEY在終端填寫進(jìn)去即可。可用登錄命令驗(yàn)證是否登錄成功
CodePush注冊(cè)登錄相關(guān)命令：
code-push login 登陸
code-push loout 注銷
code-push access-key ls 列出登陸的token
code-push access-key rm <accessKye> 刪除某個(gè) access-key
在CodePush服務(wù)器注冊(cè)App
code-push app add <appName> <platform> react-native
//例子：code-push app add CodePushDemo ios react-native
CodePush管理App的相關(guān)命令：
code-push app add 在賬號(hào)里面添加一個(gè)新的app
code-push app remove 或者 rm 在賬號(hào)里移除一個(gè)app
code-push app rename 重命名一個(gè)存在app
code-push app list 或則 ls 列出賬號(hào)下面的所有app
code-push app transfer 把a(bǔ)pp的所有權(quán)轉(zhuǎn)移到另外一個(gè)賬號(hào)
創(chuàng)建成功后會(huì)有Staging&Production 兩個(gè)KEY 這兩個(gè)KEY很重要 原生集成CodePush 需要使用到。
后面如果忘記可輸入以下命令插看：
code-push deployment ls <appName> -k
RN集成codePush
安裝第三方庫 codepush
npm install react-native-code-push --save
連接 codepush
react-native link react-native-code-push
在app.js里面替換以下代碼
/**
* Sample React Native App
* https://github.com/facebook/react-native
* @flow
*/
import React, { Component } from 'react';
import {
Platform,
StyleSheet,
Text,
View
} from 'react-native';
import CodePush from "react-native-code-push"; //引入code-push
let codePushOptions = {
//設(shè)置檢查更新的頻率
//ON_APP_RESUME APP恢復(fù)到前臺(tái)的時(shí)候
//ON_APP_START APP開啟的時(shí)候
//MANUAL 手動(dòng)檢查
checkFrequency : CodePush.CheckFrequency.ON_APP_START
};
const instructions = Platform.select({
ios: '現(xiàn)在是5.16 15：40分',
android: 'Double tap R on your keyboard to reload,\n' +
'Shake or press menu button for dev menu',
});
class App extends Component {
//如果有更新的提示
syncImmediate() {
CodePush.sync( {
//安裝模式
//ON_NEXT_RESUME 下次恢復(fù)到前臺(tái)時(shí)
//ON_NEXT_RESTART 下一次重啟時(shí)
//IMMEDIATE 馬上更新
installMode : CodePush.InstallMode.IMMEDIATE ,
//對(duì)話框
updateDialog : {
//是否顯示更新描述
appendReleaseDescription : true ,
//更新描述的前綴。 默認(rèn)為"Description"
descriptionPrefix : "更新內(nèi)容：" ,
//強(qiáng)制更新按鈕文字，默認(rèn)為continue
mandatoryContinueButtonLabel : "立即更新" ,
//強(qiáng)制更新時(shí)的信息. 默認(rèn)為"An update is available that must be installed."
mandatoryUpdateMessage : "必須更新后才能使用" ,
//非強(qiáng)制更新時(shí)，按鈕文字,默認(rèn)為"ignore"
optionalIgnoreButtonLabel : '稍后' ,
//非強(qiáng)制更新時(shí)，確認(rèn)按鈕文字. 默認(rèn)為"Install"
optionalInstallButtonLabel : '后臺(tái)更新' ,
//非強(qiáng)制更新時(shí)，檢查到更新的消息文本
optionalUpdateMessage : '有新版本了，是否更新？' ,
//Alert窗口的標(biāo)題
title : '更新提示'
} ,
} ,
);
}
componentWillMount() {
CodePush.disallowRestart();//頁禁止重啟
this.syncImmediate(); //開始檢查更新
}
componentDidMount() {
CodePush.allowRestart();//在加載完了，允許重啟
}
render() {
return (
<View style={styles.container}>
<Text style={styles.welcome}>
Welcome to React Native!
</Text>
<Text style={styles.instructions}>
To get started, edit App.js
</Text>
<Text style={styles.instructions}>
{instructions}
</Text>
<Text style={styles.instructions}>
這是更新的版本
</Text>
</View>
);
}
}
//這一行是必須的
App = CodePush( codePushOptions )( App );
export default App;
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
backgroundColor: '#F5FCFF',
},
welcome: {
fontSize: 20,
textAlign: 'center',
margin: 10,
},
instructions: {
textAlign: 'center',
color: '#333333',
marginBottom: 5,
},
});
到此 RN 已經(jīng) 集成成功codepush
IOS集成codePush
使用Xcode打開項(xiàng)目，Xcode的項(xiàng)目導(dǎo)航視圖中的PROJECT下選擇你的項(xiàng)目，選擇Info頁簽 ，在Configurations節(jié)點(diǎn)下單擊 + 按鈕 ，選擇Duplicate "Release Configaration，輸入Staging
選擇Build Settings tab，搜索Build Location -> Per-configuration Build Products Path -> Staging，
將之前的值：
值：$(BUILD_DIR)/$(CONFIGURATION)$(EFFECTIVE_PLATFORM_NAME)
改為：$(BUILD_DIR)/Release$(EFFECTIVE_PLATFORM_NAME)
選擇Build Settings tab，點(diǎn)擊 + 號(hào)，選擇Add User-Defined Setting，將key設(shè)置為CODEPUSH_KEY。
特別注意: Release 和 Staging的值為前面CodePush創(chuàng)建項(xiàng)目時(shí)顯示的查詢Production跟StagingKey
打開Info.plist文件，在CodePushDeploymentKey中輸入$(CODEPUSH_KEY)，并修改Bundle versions為三位1.0.0
在cocoaPod 里面添加:
pod 'CodePush', :path => '../node_modules/react-native-code-push'
獲取熱更新連接
#import <CodePush/CodePush.h>
jsCodeLocation= [CodePush bundleURL];
//之前是：jsCodeLocation=[[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];
這個(gè)時(shí)候IOS環(huán)境就集成完畢。
Staging環(huán)境為codepush熱更新的測(cè)試環(huán)境 類似Xcode的debug模式。之后發(fā)布熱更新典型的流程是先發(fā)在staging環(huán)境下沒問題了在發(fā)布到Production環(huán)境
直接運(yùn)行Staging環(huán)境會(huì)報(bào)尋找不到第三方庫Base64
先運(yùn)行Release環(huán)境之后會(huì)提示是否需要自動(dòng)設(shè)配之前導(dǎo)入的第三方庫。點(diǎn)擊 是， 之后Staging環(huán)境就不會(huì)報(bào)錯(cuò)了。
發(fā)布熱更新
非常重要：先在RN項(xiàng)目的根目錄創(chuàng)建文件夾 bundle 在bundle里面在創(chuàng)建ios文件夾
生成main.jsbundle包：
生成bundle命令 react-native bundle --platform 平臺(tái) --entry-file 啟動(dòng)文件 --bundle-output 打包js輸出文件 --assets-dest 資源輸出目錄 --dev 是否調(diào)試
例子：
react-native bundle --entry-file index.js --bundle-output ./bundle/ios/main.jsbundle --platform ios --assets-dest ./bundle/ios --dev false
將生成的main.jsbundle拖入ios項(xiàng)目中
將main.jsbundle上傳到codepush服務(wù)器
code-push release-react <AppName> <Platform> --t <填寫IOS項(xiàng)目版本號(hào)> --des <本次更新說明>
**注意:**CodePush默認(rèn)是更新Staging 環(huán)境的，如果發(fā)布生產(chǎn)環(huán)境的更新包，需要指定--d參數(shù)：--d Production，如果發(fā)布的是強(qiáng)制更新包，需要加上 --m true強(qiáng)制更新
例子：
code-push release-react codePushDemo ios --t 1.0.0 --dev false --des "這是第一個(gè)更新包" --m true
巨坑出現(xiàn)： 填寫IOS項(xiàng)目版本號(hào)！??！ 填寫IOS項(xiàng)目版本號(hào)?。?！IOS項(xiàng)目版本號(hào)是多少就填多少?。。。?/p>
查看上傳歷史記錄
//查詢Production
code-push deployment history <AppName> Production
//查詢Staging
code-push deployment history <AppName> Staging
之后版本更新 需要重新打包main.jsbundle 在將main.jsbundle發(fā)到codepush上去。
