移植一个成熟的 React Web 应用程序以响应本机答案

【问题标题】：Porting a full blown react web app to react native移植一个成熟的 React Web 应用程序以响应本机
【发布时间】：2016-09-30 22:26:29
【问题描述】：

我有一个成熟的移动网络应用程序，使用以下内容：

反应
Redux
Redux-React
反应路由器
Firebase

我最终想将此移动网络应用程序转换为移动应用程序，并且正在考虑使用 React Native。有很多关于如何从头开始构建 React Native 应用程序或将 Objective-C 中的本机应用程序转换为 react native 的文献，但我正在努力寻找一些关于如何将移动 Web 应用程序带入移动 Web 应用程序的先验技术本机。

更具体地说，哪些东西不能开箱即用？我在看React-Router。

关于如何开始过渡、触摸什么以及不担心什么的一些想法会非常有帮助。

更新：

想象以下应用程序结构。它已经有很多代码了。所以，我想知道是否有办法逐步做到这一点？

【问题讨论】：

react-router 不起作用，你是对的。可能想使用 react-native-redux-router 或 react-native-router-flux
实际上，不完全是，Este 项目能够将 react-router 合并到他们的 React Native 项目中，请查看：github.com/este/este/blob/…

标签： reactjs react-native

【解决方案1】：

许多人正在逐步将他们的 React 应用程序移植到 React Native，方法是使用 Web 视图作为最初的“入门”，然后逐流使用 React Native 视图。随着最近可用的 react-native-webview-bridge (https://github.com/alinz/react-native-webview-bridge)，这些 web 视图和 react native 组件之间的双向通信现在非常容易。

在 iOS 上使用 Web 视图与常规 Safari 应用程序相比可能会出现性能问题，因此可能会强制将某些 UI 流转换为 React Native，然后才能发布。

我强烈建议将任何 Selenium 测试转换为 Appium，以保持您的自动化测试覆盖率。 React Native 仍然有点不稳定，能够快速安全地升级将高度依赖于拥有自动化测试套件。

【讨论】：

【解决方案2】：

确保您的 API（您有吗）、reducer 和您的操作在您的 web 文件夹之外，因为您将能够在您的移动应用程序中使用它们。您的大部分应用程序结构将是相同的，除了反应路由器。像 Jan Fanz Palngipang 一样，您可以使用 react-native-router-flux （这是我正在使用的）我建议你检查像 nativebase、rReact Starter Pro 这样的入门工具包，看看他们的抽屉是如何工作的。（看看他们如何改变容器）

【讨论】：