在两个独立的项目 React Js 和 React Native 之间共享代码的最佳解决方案？（如 redux 商店）

Question

对于一个项目，我们需要有一个网站和一个移动应用程序（不是响应式网站），它们都将使用我的 API。我曾经使用过 React，所以我检查了很多关于移动应用程序部分的 React-Native。

据我所知，这需要创建 2 个不同的项目，这样做似乎更有效（此外，如果这 2 个项目不共享同一个客户端）。问题是，乍一看，两者都将使用同一个商店……我不想复制我的商店，也不想每次更新我的 API 时都更新它们……我在React之间看到的唯一区别网站和我的React Native App 就是它们呈现的方式。它们都具有相同的功能。我们可以进一步假设它们也将共享相同的容器吗？

我尝试在 github 上打开一个问题，但他们将我重定向到这里讨论它。

所以我想知道你们是否有最好的解决方案（干净且没有意外）来在 React 和 React Native 之间共享代码？如果是这样，教程将非常感激。

（注意：搜索非常耗时，React Native 文档应该保留一个关于这个主题的部分......）

Answer 1

这个问题在这个帖子中得到了回答。

总体思路是为每个平台提供不同的入口点，并让特定于平台的代码（Web 版 React 和移动版 React Native）共享通用代码，例如 Redux 商店。

还可以在我链接的线程中找到一篇深入的文章。

话虽这么说，这个想法有很多权衡和陷阱，其中之一是依赖管理，正如您从链接文章中的评论中看到的那样：

我刚刚了解到这种结构的缺点。通过在原生和 Web 之间共享通用的 package.json，您可以通过它们的通用依赖项将它们粘合在一起，其中最重要的依赖项是 React。假设您升级到依赖于>=react@16的react-native版本，但是您的Web应用程序依赖于其他依赖于=<react@15的库。这件事刚刚发生在我身上，我找不到简单的出路。

另一种可行的方法是将代码的公共区域转换为库，您可以将它们导出和导入到每个单独的项目（移动和网络）。这样您就可以避免第一个选项的问题，但现在您仍然必须维护和更新两个单独的代码存储库。

为了回答你的问题，评论：我认为让一个项目共享两个平台的代码没有什么问题，但必须非常仔细地计划，这样你在尝试添加新东西时就不会破坏两个项目。尝试首先规划您的项目结构，以便 Web 和移动代码之间有明确的分离，并检查您的依赖项是否彼此兼容。

这是一篇博客文章，其中包含一个示例项目，可以帮助您设计项目。

编辑：您可以尝试React Native Web，但它仍处于 alpha 阶段，所以我不会推荐它用于与工作相关的项目（不过对于学校/个人项目应该没问题）。