CodePush 热更新ReactNative之React Native Client SDK

柳威
2023-12-01

目前用的RN版本都是大于0.30的所以一般用最新的codePush
安装
1. 前往目录下安装 npm install --save react-native-code-push@latest
2. 安装,推荐使用 rnpm link react-native-code-push 若未安装rnpm 使用npm i -g rnpm 安装
3. 配置(iOS)

  1. 在AppDelegate.m中加入头文件 #import "CodePush.h"
  2. jsCodeLocation = [CodePush bundleURL]; 替换其他的jsCodeLocation
  3. 更改Info.plist ,在里面增加 CodePushDeploymentKey 从新建的codePush中获取到开发环境的key;可以用这个显示key code-push deployment ls <appName> -k


  1. 配置(安装)

  1. MainApplication.java 中加入修改
// 1. Import the plugin class.
import com.microsoft.codepush.react.CodePush;
public class MainApplication extends Application implements ReactApplication {
    private final ReactNativeHost mReactNativeHost = new ReactNativeHost(this) {
        ...
        // 2. Override the getJSBundleFile method in order to let
        // the CodePush runtime determine where to get the JS
        // bundle location from on each app start
        @Override
        protected String getJSBundleFile() {
            return CodePush.getJSBundleFile();
        }
        @Override
        protected List<ReactPackage> getPackages() {
            // 3. Instantiate an instance of the CodePush runtime and add it to the list of
            // existing packages, specifying the right deployment key. If you don't already
            // have it, you can run "code-push deployment ls <appName> -k" to retrieve your key.
            return Arrays.<ReactPackage>asList(
                new MainReactPackage(),
                new CodePush("deployment-key-here", MainApplication.this, BuildConfig.DEBUG)
            );
        }
    };
}

5.发布版本包

//基本不会出错的方法
code-push release-react <appName> <platform>
code-push release-react MyApp ios
code-push release-react MyApp-Android android

自己定义的版本发布

# Release a mandatory update with a changelog//发布强制性升级的包,并添加描述
code-push release-react MyApp ios -m --description "Modified the header color"
# Release an update for an app that uses a non-standard entry file name, and also capture
# the sourcemap file generated by react-native bundle
code-push release-react MyApp ios --entryFile MyApp.js --sourcemapOutput ../maps/MyApp.map
# Release a dev Android build to just 1/4 of your end users
code-push release-react MyApp-Android android --rollout 25% --dev true
# Release an update that targets users running any 1.1.* binary, as opposed to
# limiting the update to exact version name in the build.gradle file
code-push release-react MyApp-Android android --targetBinaryVersion "~1.1.0"

6.JavaScript中代码

//导入文件
import codePush from "react-native-code-push";
//设置检查更新的方法-开启检查更新
let CodePushOptions = { checkFrequency: codePush.CheckFrequency.ON_APP_START };

class MyApp extends Component {
render (){

}
componentDidMount() {
    codePush.sync({
      updateDialog: false,//检查更新,不弹出提示
      installMode: codePush.InstallMode.ON_NEXT_RESUME//更新模式,下一次进入
    });
    //如果你期望更及时的获得更新,可以在每次APP从后台进入前台的时候去主动的检查更新:
    AppState.addEventListener("change", (newState) => {
      newState === "active" && codePush.sync();
    });
  }
componentWillMount() {
    // Ensure that any CodePush updates which are
    // synchronized in the background can't trigger
    // a restart while this component is mounted.
    // codePush.disallowRestart();
    codePush.allowRestart();
  }
componentWillUnmount() {
    // Reallow restarts, and optionally trigger
    // a restart if one was currently pending.
    codePush.allowRestart();
  }
}
MyApp = codePush(CodePushOptions)(MyApp);
AppRegistry.registerComponent('codePushTest', () => MyApp);
 类似资料: