RNApp

基本介绍

RNApp 是用于启动和管理 RNInstance 和 RNSurface 的模块，封装了创建与启动单个 RNInstance 和单个 RNSuface 的行为，同时您也不需要考虑在什么时间加载 JS Bundle，如果您的应用只需要单 RNInstance，同时只需要单 RNSurface，您可以通过 RNApp 来创建您的 RN 应用，从而免去一系列繁琐的操作，达到即开即用的效果。对于具有多个 Surface 的应用程序，可以考虑使用 RNSurface，本节主要介绍了 RNApp 的接口类型以及使用方式。

关键参数

参数名	类型	必填	说明
rnInstanceConfig	RNInstanceConfig	是	用于创建RNInstance的RNInstance或RNInstanceOptions。如果提供了RNInstanceOptions，则此组件负责创建和管理RNInstance。
appKey	string	是	开发者在JS侧使用AppRegistry.registerComponent注册的名称。
jsBundleProvider	JSBundleProvider	否	在RNInstance中运行JS Bundle。Bundle被加载后创建Surface(根容器)。
initialProps	Record<string, string>	否	React Native应用的初始化参数。
wrappedCustomRNComponentBuilder	WrappedCustomRNComponentBuilder	是	构建自定义Fabric组件构造器。如果这一参数不设置或设为undefined会导致RNApp初始化失败，显示白屏。
onSetUp	void	否	在RNInstance创建完成且Surface可见前，调用此回调函数。

方法

onSetUp

onSetUp: (rnInstance: RNInstance) => Promise<void> | void = () => Promise.resolve()

在 Surface 可见且 RNInstance 可用之前，调用 RNInstance 中想要执行的方法。

参数

参数名	类型	必填	说明
rnInstance	RNInstance	是	RNInstance对象。

具体使用说明

RNApp({
  // 用于指定React Native 实例的配置
  rnInstanceConfig: {
    // 外部功能包管理（向框架提供额外的功能特性）
    createRNPackages,
    // 是否启用C++原生文本测算接口
    enableNDKTextMeasuring: true,
    // 是否启动后台线程，建议关闭后台线程
    enableBackgroundExecutor: false,
    // 是否使用CAPI架构，默认为true
    enableCAPIArchitecture: true,
    // ArkTS自定义组件的名称
    arkTsComponentNames,
  },
  // 传递初始属性给 React Native 应用
  initialProps: { "foo": "bar" } as Record<string, string>,
  appKey: "app_name",
  // 构建自定义组件
  wrappedCustomRNComponentBuilder: wrappedCustomRNComponentBuilder,
  // 在surface可见且rnInstance可用之前，调用`RNInstance`中想要执行的方法
  onSetUp: (rnInstance) => {
    rnInstance.enableFeatureFlag("ENABLE_RN_INSTANCE_CLEAN_UP")
  },
  // 用于指定 JavaScript bundle 文件的提供方式
  jsBundleProvider: new TraceJSBundleProviderDecorator(
    new AnyJSBundleProvider([
    new MetroJSBundleProvider(),
    /**
     * 注意：要从`/data/app/el2/100/base/com.rnoh.tester/files/bundle.harmony.js`加载bundle包。路径不匹配是由于OpenHarmony上的应用程序沙盒
     */
    new FileJSBundleProvider('/data/storage/el2/base/files/bundle.harmony.js'),
    new ResourceJSBundleProvider(this.rnohCoreContext.uiAbilityContext.resourceManager, 'hermes_bundle.hbc'),
    new ResourceJSBundleProvider(this.rnohCoreContext.uiAbilityContext.resourceManager, 'bundle.harmony.js')
  ]),
  this.rnohCoreContext.logger),
})

---

React Native on Harmony (RNOH)‌ 框架中的 ‌RNApp‌ 模块的配置代码。

代码分析

1. 功能定位

RNApp 是一个‌高级封装模块‌，专门用于简化 React Native 在鸿蒙平台上的应用启动过程。

2. 核心作用

• 管理 RNInstance‌：创建和管理 React Native 运行实例
• 管理 RNSurface‌：创建和管理渲染表面
• 自动处理JS Bundle加载‌：无需手动管理加载时机

3. 主要参数解析

必需参数：‌

• rnInstanceConfig：配置 RN 实例的行为和特性
• appKey：与 JS 侧 AppRegistry.registerComponent 注册的名称对应
• wrappedCustomRNComponentBuilder：自定义组件构建器

可选参数：‌

• jsBundleProvider：JS Bundle 文件提供策略
• initialProps：传递给 React Native 应用的初始化属性
• onSetUp：实例创建完成后的回调函数

4. 技术特点

配置灵活性：‌

• 支持多种 Bundle 加载方式（Metro、File、Resource）
• 可配置性能优化选项（NDK文本测量、后台线程等）
• 支持自定义 ArkTS 组件

即开即用：‌

• 封装了底层复杂操作
• 自动处理生命周期管理
• 提供统一的启动接口

5. 适用场景

• 单实例单表面应用‌：大多数标准 RN 应用
• 快速原型开发‌：无需关注底层实现细节

这个 RNApp 模块大大简化了在鸿蒙平台上开发 React Native 应用的复杂度，开发者只需要关注业务逻辑，而无需处理平台特定的集成细节。这个代码片段展示的是 ‌配置对象‌，用于初始化 RNApp 实例，属于 RNOH 框架的核心启动模块。