美文网首页
react-native 热更新(Android)

react-native 热更新(Android)

作者: 捡破烂儿的 | 来源:发表于2018-08-07 16:32 被阅读0次

    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 <appName> <os> <platform>
    
    添加APP.png

    添加团队成员

    code-push collaborator add <appName> <email>
    

    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<ReactPackage> getPackages() {
          return Arrays.<ReactPackage>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 <appName> <os>  --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)

          本文链接:https://www.haomeiwen.com/subject/qlxavftx.html