ReactNative 热更新
使用 react-native-update,这个库是在 RN 中文网上推广的。鉴于测试、使用改库,我们还可以自建 codepush服务,不过这个后面会详细讲到,官网地址。
基础环境
1. 全局安装 update-cli
先全局安装命令行工具,每台电脑只用装一次
npm i -g react-native-update-cli
2. 项目初始化
然后在项目目录中安装热更新模块
0.71 及以上版本使用最新版本如下
npm i react-native-update
项目配置
IOS
找到 ios>AppDelegate.m 文件
// 修改以下内容
#import "RCTPushy.h"
- (NSURL *)getBundleURL
{
#if DEBUG
return [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index"];
#else
// 这里改为 RCTPushy bundleURL, 热更新
// return [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];
return [RCTPushy bundleURL];
#endif
}
@end
ANDROID
在 MainApplication
中增加如下代码(如果是混编原生的项目或其他原因没有使用 ReactApplication
,请使用此 api 集成):
● Kotlin 版本
// … 其它代码
// ↓↓↓请注意不要少了这句import
import cn.reactnative.modules.update.UpdateContext;
// ↑↑↑
class MainApplication : Application(), ReactApplication {
override val reactNativeHost: ReactNativeHost =
object : DefaultReactNativeHost(this) {
// ↓↓↓将下面这一段添加到 DefaultReactNativeHost 内部!
override fun getJSBundleFile(): String? {
return UpdateContext.getBundleUrl(this@MainApplication)
}
// ↑↑↑
// ...其他代码
}
}
● Java版本
// ... 其它代码
// ↓↓↓请注意不要少了这句import
import cn.reactnative.modules.update.UpdateContext;
// ↑↑↑
public class MainApplication extends Application implements ReactApplication {
private final ReactNativeHost mReactNativeHost =
// 老版本 RN 这里可能是 new ReactNativeHost(this)
new DefaultReactNativeHost(this) {
// ↓↓↓将下面这一段添加到 DefaultReactNativeHost 内部!
@Override