(笔记) RN React Native 热更新(react-native-code-push) AppCenter
蘋果App允許使用熱更新Apple's developer agreement, 為了不影響用戶體驗(yàn),規(guī)定必須使用靜默更新。 Google Play不能使用靜默更新,必須彈框告知用戶App有更新。中國(guó)的android市場(chǎng)必須采用靜默更新(如果彈框提示,App會(huì)被“請(qǐng)上傳最新版本的二進(jìn)制應(yīng)用包”原因駁回)。?
自備梯子,國(guó)內(nèi)App可自配下載地址或者參考 rn中文網(wǎng)
?code push已經(jīng)遷移到 App Center上
?
基本步驟就是 配置 打包 發(fā)布新版本
?
參考
官方文檔 安裝 發(fā)布
https://docs.microsoft.com/en-us/appcenter/distribution/codepush/react-native#releasing-updates
https://www.jianshu.com/p/84307d3aa824? ? ? //這個(gè)比較詳細(xì)
?
?
? ?安裝App Center CLI
npm install -g appcenter-cli?
?
添加項(xiàng)目
appcenter apps create -d AwesomeProject -o Android -p React-Native
檢測(cè)是否添加成功
appcenter apps list
部署 (獲取key)
appcenter codepush deployment add -a slf1501-163.com/AwesomeProject Staging
appcenter codepush deployment add -a slf1501-163.com/AwesomeProject Production
?查詢key
appcenter codepush deployment list -a ?slf1501-163.com/AwesomeProject ?-k
?
?記得把MainApplication里的key替換
?
@Override
protectedList<ReactPackage>getPackages(){
returnArrays.<ReactPackage>asList(
newMainReactPackage(),
newCodePush("CTjphNv3zzJCF2wbVQfwaIhcNWE9HJ1Wh1Zp4",getApplicationContext(),BuildConfig.DEBUG)
);
}
?
入口文件
import {AppRegistry} from 'react-native'; import CodePush from "react-native-code-push"; // 靜默方式,app每次啟動(dòng)的時(shí)候,都檢測(cè)一下更新 'ON_APP_RESUME' // const codePushOptions = { checkFrequency: CodePush.CheckFrequency.ON_APP_RESUME };// 手動(dòng)方式接收更新的方式 const codePushOptions = { checkFrequency: CodePush.CheckFrequency.ON_APP_RESUME }; import _App from './App'; const App = CodePush(codePushOptions)(_App); import {name as appName} from './app.json'; AppRegistry.registerComponent(appName, () => App);或者
import React, { Component } from 'react'; import {Platform,StyleSheet,Text,View } from 'react-native';import CodePush from "react-native-code-push"; // 引入code-pushlet codePushOptions = {//設(shè)置檢查更新的頻率//ON_APP_RESUME APP恢復(fù)到前臺(tái)的時(shí)候//ON_APP_START APP開啟的時(shí)候//MANUAL 手動(dòng)檢查checkFrequency : CodePush.CheckFrequency.ON_APP_RESUME };const instructions = Platform.select({ios: 'Press Cmd+R to reload,\n' +'Cmd+D or shake for dev menu',android: 'Double tap R on your keyboard to reload,\n' +'Shake or press menu button for dev menu', });type Props = {};class App extends Component<Props> {//如果有更新的提示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)為continuemandatoryContinueButtonLabel : "立即更新" ,//強(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 Appconst 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,}, })?
打包 apk? 安裝以后 更改樣式 發(fā)布
appcenter codepush release-react -a slf1501-163.com/splashExample-android?? ?
-m true? 強(qiáng)制更新
?
?
總結(jié)
以上是生活随笔為你收集整理的(笔记) RN React Native 热更新(react-native-code-push) AppCenter的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇: Three开发笔记(二)
- 下一篇: 自动驾驶车载激光雷达-数据集整理