React Native项目配置Code Push

react native 项目配置code push
本次项目的项目依赖关键包的版本如下：

react:  6.11.0,
react-native: 0.62.2,
react-native-code-push: ^6.2.1,

• 全局安装code-push

npm install -g code-push-cli

• 安装react native版的code-push插件

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

配置IOS

• 进入ios路径下执行如下命令：

pod install

• 在AppDelegate.m文件引入codepush

#import <CodePush/CodePush.h>

image.png

• 修改AppDelegate.m文件，查找一下代码行，用于设置生产版本bridge的源URL:
  return [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];
  替换为 如下代码：

return [CodePush bundleURL];

• 配置xcode，注意，使用的是.xcworkspace
  添加Staging
  添加codepus的key
  debug可以不设置key
  同理创建CODEPUSH_URL(我个人的项目填写地址时，端口号后面不加 /，加了就找不到) ！！！！
• 进入./ios/项目名/Info.plist中添加CodePushDeploymentKey和对应的key，及修改成三位的版本号。添加如下代码：

<key>CFBundleVersion</key>
<string>1.0.0</string>
<key>CodePushDeploymentKey</key>
<string>$(CODEPUSH_KEY)</string>
<key>CodePushServerURL</key>
<string>$(CODEPUSH_URL)</string>

• 进入Produce->Scheme->Edit Scheme,修改Archive中Build Configuration的值为Release

  
  image.png
• 运行项目看下是否成功，能启动成功说明配置没有问题

到此IOS端的CodePush配置完成，然后提交版本进行测试即可。

Android配置code push

• 到./android/app/build.gradle 头部引入codepush.gradle 和react.gradle
  需注意： 查看js中是否已包含react.gradle，避免重复引入

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

• 到./android/app/src/main/java/com/项目名称/MainApplication.java添加如下内容
  注意：只需要添加如下代码 不需要添加其他

  // 添加的内容
   @Override
   protected String getJSBundleFile() {
       return CodePush.getJSBundleFile();
   }

加完之后的内容

• 打开./android/app/src/main/res/values/strings.xml，添加如下内容：
  注意：0.62版本 “CodePushDeploymentKey”是固定的，就被这个名字坑了好久好久。。。

 <string moduleConfig="true" name="CodePushDeploymentKey">你的DeploymentKey</string>

• 将./android/app/build.gradle文件中的defaultConfig对象下的versionName改为三位数

./android/app/build.gradle

• 检查一下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')

注意： 一定要修改rn项目下./node_modules/react-native-code-push/android/app/src/main/java/com/microsoft/codepush/react/CodePush.javamServerUrl地址。默认是官网地址

image.png

---

实例

import codePush from 'react-native-code-push';
const DEPLOYMENT_KEY=Platform.OS==='ios'?' 你的 ios key ':你的 android key';

 componentWillMount() {
    codePush.disallowRestart();//禁止重启
    this.syncImmediate(); //开始检查更新
  }
  componentDidMount(){
    codePush.allowRestart();                //在加载完了，允许重启
  }
  syncImmediate() {
    codePush.sync( {
            //安装模式
            //ON_NEXT_RESUME 下次恢复到前台时
            //ON_NEXT_RESTART 下一次重启时
            //IMMEDIATE 马上更新
            mandatoryInstallMode : codePush.InstallMode.IMMEDIATE,
            deploymentKey: DEPLOYMENT_KEY,
            //对话框
            updateDialog : {
                //是否显示更新描述
                appendReleaseDescription : true ,
                //更新描述的前缀。 默认为"Description"
                descriptionPrefix : "更新内容：" ,
                //强制更新按钮文字，默认为continue
                mandatoryContinueButtonLabel : "立即更新" ,
                //强制更新时的信息. 默认为"An update is available that must be installed."
                mandatoryUpdateMessage : "必须更新后才能使用" ,
                //非强制更新时，按钮文字,默认为"ignore"
                optionalIgnoreButtonLabel : '稍后' ,
                //非强制更新时，确认按钮文字. 默认为"Install"
                optionalInstallButtonLabel : '后台更新' ,
                //非强制更新时，检查到更新的消息文本
                optionalUpdateMessage : '有新版本了，是否更新？' ,
                //Alert窗口的标题
                title : '更新提示'
            }
        }
    );
  }

code push常用命令可在上一篇文章看到。