react-native 热更新(Android)

1、安装code-push-cli

安装    npm install -g code-push-cli
注册    code-push register

跟着流程注册就行了

登录     code-push-login

会自动弹出token


登录.png

多试几次吧,很有可能弹不出来token

2、添加APP

code-push app add   
react-native 热更新(Android)_第1张图片
添加APP.png

添加团队成员

code-push collaborator add  

3、集成CodePush SDK

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

检查link是否完善
android/app/build.gradle

apply from: "../../node_modules/react-native-code-push/android/codepush.gradle"

defaultConfig {
      versionName "1.0.0"   // 默认是1.0,但code-push要求3位
}

buildTypes {
            debug  {
                buildConfigField "String", "CODEPUSH_KEY", '""'
            }

            releaseStaging {
               buildConfigField "String", "CODEPUSH_KEY", '"Deployment Key For Staging"'
            }

            release {           
                proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"

                signingConfig signingConfigs.release
                buildConfigField "String", "CODEPUSH_KEY", '"Deployment Key For Production"'
            }
    }

dependencies  {
    compile project(':react-native-code-push')
}

android/settings.gradle

include ':react-native-code-push'
project(':react-native-code-push').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-code-push/android/app')

MainApplication.java

import com.microsoft.codepush.react.CodePush;

@Override
protected String getJSBundleFile() {
     return CodePush.getJSBundleFile();
}

@Override
protected List getPackages() {
      return Arrays.asList(         
          new CodePush("Deployment Key", MainApplication.this, BuildConfig.DEBUG),      
      );
}

4、热更新

添加检查更新,我是在点击版本号检查,也可以打开App自动检查

import codePush from "react-native-code-push";

const {SyncStatus} = codePush;

const SYNC_MSG_MAP = {
    [SyncStatus.UP_TO_DATE]: "已经是最新了",
    [SyncStatus.UPDATE_IGNORED]: "已忽略",
    [SyncStatus.UPDATE_INSTALLED]: "安装成功",
    [SyncStatus.UNKNOWN_ERROR]: "未知的错误",
    [SyncStatus.SYNC_IN_PROGRESS]: "后台已经在更新",
    [SyncStatus.CHECKING_FOR_UPDATE]: "再整检查",
    [SyncStatus.AWAITING_USER_ACTION]: "等等用户选择",
    [SyncStatus.DOWNLOADING_PACKAGE]: "下载中",
    [SyncStatus.INSTALLING_UPDATE]: "安装中"
};

const updateDialog = {
    descriptionPrefix: "内容:",
    mandatoryContinueButtonLabel: "立即更新",
    mandatoryUpdateMessage: "必须更新",
    optionalIgnoreButtonLabel: "忽略",
    optionalInstallButtonLabel: "立即更新",
    optionalUpdateMessage: "一个更新是可用的。你想要安装它吗?",
    title: "检测到更新"
};

updateVersion = () => {      
        const {InstallMode, sync} = codePush;
        sync({
            updateDialog,//更新对话框的文字配置
            deploymentKey: '',//动态改变deploymentKey ,可以不设置,如果不设置使用原生代码内整合的key       
            installMode: InstallMode.IMMEDIATE,//普通更新立即更新
            mandatoryInstallMode: InstallMode.IMMEDIATE//必选更新立即更新
        }).then((state) => {
            Modal.alert(SYNC_MSG_MAP[state] || "未知状态", '');//显示更新结果提示
        }).catch((e) => {
           
        });
    }

打包assets资源

react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res/

我直接构建的release版本

$ cd android && ./gradlew assembleRelease

签署应用:https://reactnative.cn/docs/0.51/signed-apk-android.html#content

将打包的APP装在手机

随意修改代码

code-push release-react    --t 1.0.0  --d Production --des "1.随意修改代码" --m true

需要注意的是,这里的版本号是指在1.0.0基础上更新,不是指更新到1.0.0版本

关于code-push release-react更多可选的参数,可以在终端输入code-push release-react进行查看

你可能感兴趣的:(react-native 热更新(Android))