将React-Native集成到现有应用

时间:2018-03-20 13:16:05

标签: ios react-native

我希望在现有的iOS应用中集成react-native模块,但要将这两种解决方案分开保存。 我希望有一个独立的react-native解决方案,并以某种方式将react-native应用程序的Xcode项目导入到我现有的应用程序中,而不是执行修改现有解决方案的https://facebook.github.io/react-native/docs/integration-with-existing-apps.html。 这使我可以继续开发现有的应用程序,而不受RN解决方案的影响,该解决方案为Xcode项目安装和添加库。 基本上,概念是将反应原生解决方案导出为捆绑包或静态库,并将其导入我已有的iOS应用程序中。之后,从现有的iOS应用程序与此库进行交互,并允许React-Native Solution库与现有应用程序进行交互。应该有一种方法可以从现有的应用程序到RN解决方案库以及已经存在的RN解决方案库进行通信(即,用于从现有iOS应用程序启动模块以及从RN解决方案启动视图已经存在的应用程序) 这可能吗?

1 个答案:

答案 0 :(得分:0)

你可以完成你所指的大部分事情。如果错过了什么,请原谅......

Runninig独立

如果您的RN目录中没有 ios android 文件夹,则必须从CLI运行react-native eject

可以使用以下CLI命令将React-native应用程序作为独立的本机应用程序启动:

react-native run-ios(仅限MacOS)

react-native run-android

如果正在使用默认值,请添加--port ####

两个命令都会启动类似 sandbox 本机应用程序的内容,它将在内部加载JS。它还将启动Metro捆绑器,它也将为js捆绑服务。

将RN加载到现有应用

您需要为Android和iOS添加原生 RN库作为依赖项,因此您可以使用它们从Dev服务器加载JS包或在本机构建中插入JS包。

使用开发服务器运行react-native start

要将JS构建为将添加到本机程序包的文件,您必须运行该程序:

react-native bundle ios 接下来是几个选项

--dev false或true

--entry-file index.ios.js更改此项以匹配您的输入文件。它可能只是index.js。小心匹配Java / Obj-C代码中的名称。

--bundle-output ../YOUR-EXISTING-IOS-APP/main.jsbundle

--assets-dest ../YOUR-EXISTING-IOS-APP

<强>通信

这发生在 RCTBridge 上。

Check this page有关如何从RN环境访问本机功能的说明和示例。