React Native for OpenHarmony (RNOH) 技术文档

React Native for OpenHarmony (RNOH) 技术文档

【免费下载链接】ohos_react_native React Native鸿蒙化仓库 项目地址: https://gitcode.com/openharmony-sig/ohos_react_native

1. 安装指南

1.1 环境准备

1.1.1 硬件要求

• 已安装HarmonyOS NEXT的模拟器或真机设备
• 推荐配置：8GB以上内存，20GB以上可用磁盘空间

1.1.2 软件要求

• Node.js 16.x或更高版本
• Git 2.20或更高版本
• DevEco Studio最新版本
• 华为开发者账号（用于应用签名）

1.2 依赖安装

1. 克隆项目仓库
2. 在项目根目录执行：git submodule update --init --recursive
3. 确保已安装npm或yarn包管理工具

2. 项目安装方式

2.1 基础安装步骤

1. 导航至react-native-harmony-cli目录，执行：

   npm i && npm pack
   

2. 进入react-native-harmony-sample-package目录，执行：

   npm i && npm pack
   

3. 进入tester目录，执行：

   npm run i
   

2.2 环境变量配置

设置RNOH_C_API_ARCH环境变量值为1：

export RNOH_C_API_ARCH=1

3. 项目使用说明

3.1 启动项目

1. 在tester目录启动Metro服务器：

   npm start
   

2. 使用DevEco Studio打开tester/harmony项目
3. 等待项目同步完成
4. 连接测试设备

3.2 项目签名

1. 在DevEco Studio中选择：File > Project Structure > Signing Configs
2. 使用华为开发者账号登录并完成签名配置

3.3 运行项目

1. 在DevEco Studio右上角选择entry模块
2. 点击【Run 'entry'】按钮运行项目

4. 项目API使用文档

4.1 核心API

RNOH提供了与React Native兼容的核心API，包括：

• 基础组件（View, Text, Image等）
• 样式系统
• 布局系统
• 事件处理

4.2 平台特定API

RNOH针对OpenHarmony平台扩展了以下API：

• 设备能力接口
• 系统服务调用
• 原生模块集成

4.3 API调用示例

import { View, Text } from 'react-native';

function ExampleComponent() {
  return (
    <View style={{flex: 1, justifyContent: 'center'}}>
      <Text>Hello OpenHarmony</Text>
    </View>
  );
}

5. 注意事项

1. tester项目主要用于开发自测试，生产环境建议创建独立项目
2. 运行过程中如遇问题，请检查环境变量设置是否正确
3. 建议定期更新项目依赖以获取最新功能和修复
4. 复杂场景建议参考官方文档中的高级配置指南

【免费下载链接】ohos_react_native React Native鸿蒙化仓库 项目地址: https://gitcode.com/openharmony-sig/ohos_react_native