react-native-dynamic-load

https://github.com/MrGaoGang/…

react-native dynamic load bundle from remote;

Support

• iOS/Android dynamic load jsbundle/common bundle;
• iOS/Android supports simultaneous loading of multiple bundles

实现逻辑

分包

如何进行分包？点击 ReactNative 分包计划介绍

# ios 运行

npm run build:ios

# android 运行

npm run build:android

会主动进行分包，如果想要打包后的产物为数字类型，则在 compile/metro-base.js 中设置 moduleIdByIndex=true 即可

iOS 客户端动静加载

// 在利用启动的时候加载 jsbundle 根底包
[BridgeManager.instance loadBaseBundleWithLaunchOptions:launchOptions];

// 在须要的时候加载业务包
// 此处只是应用加载本地的 bundle 的形式，如果是在线的形式，能够先应用 http 下载而后加载本地
[BridgeManager.instance
    loadBusinessBundle:@"business.ios"
            moduleName:@"ReactNativeDynamic"
              callback:^(BOOL succeed) {if (succeed) {RCTRootView *rootView = [[RCTRootView alloc]
                         initWithBridge:BridgeManager.instance.commonBridge
                             moduleName:@"ReactNativeDynamic"
                      initialProperties:nil];
                  self.view = rootView;
                }
  NSLog(@"%d",succeed);
              }];

Android 客户端动静加载

// 利用启动的时候
SoLoader.init(this, /* native exopackage */ false);
ReactAppRuntime.init(this);

// 你的 activity
public class MainActivity  extends DynamicReactActivity {

  @Override
  protected RnBundle getBundle(){RnBundle bundle = new RnBundle();
    bundle.scriptType = ScriptType.ASSET;
    bundle.scriptPath = "business.android.bundle";
    bundle.scriptUrl = "business.android.bundle";
    bundle.appName = "ReactNativeDynamic";
    return bundle;
  }
}