react native 如何将其代码编译成原生应用程序？

Posted 2023-02-22

【中文标题】react native 如何将其代码编译成原生应用程序？

【英文标题】：How does react native compile it's code into native apps?

【发布时间】：2017-04-26 16:02:06

【问题描述】：

最近开始使用 react native 和项目需要在服务器上构建应用程序。所以理论是应用程序可以根据请求构建，这意味着一些东西，让我们称之为反应原生编译器，需要在某个允许我这样做的服务器上。

例如，这是 react native 编译器的位置“http://example.com/compile”，并且您在该站点上有一些设置选项和“编译”按钮，当您单击按钮时，应用程序编译器将启动，然后x 秒 android 和 iphone 应用程序已准备好下载。这可能吗？

【问题讨论】：

***.com/a/61729772/11574750

【参考方案1】：

这当然是可能的，尽管实现起来可能很复杂，但这一切都归结为您想要实现的复杂程度（只是一个构建系统、一个在线 IDE...）。

每个 React Native 应用程序都包含 javascript 代码和一个 Android 和 ios 项目（您可以通过 3rd 方的努力包含更多平台，但让我们保持简单）。 iOS 和 Android SDK 都为构建功能提供了命令行工具。对于 iOS，您有 xcrun 命令，而在 Android 中，该项目包含一些您可以执行的 gradle 命令。因此，一般来说，您只需在用户请求时通过您的后端执行这些命令。

本质上，您需要的是与持续集成服务器相同的设置，但不是在进行更改时触发构建，而是服务器应按需构建应用程序，然后将编译结果发送回用户。例如，您可以阅读有关 React Native here 和 here 的 CI 的更多信息。

【讨论】：

我需要一个构建系统。所有应用程序的一切都是通用的，我需要在每个构建中更改的只是一个参数（现在，将来更多）。每个应用程序的一个参数会有所不同，功能和设计也会因该参数而异。

我提到的命令的好处是它们是高度可参数化的，所以你绝对可以做到。例如，对于 Android，您可以在等级构建文件中使用环境变量。如果您提供有关设置的更多详细信息，也许我们可以针对您的情况提出更具体的建议。

此时，我只需要在构建它时发送给 reactnative 应用程序的是一个 20 个字符的字符串，例如一个网站 url 和未来一个字符串，其中定义了应用程序显示设置，标题样式，颜色和类似物。

假设这是 url "example.com/display-data"，在这个 url 上是一个 json 文件，数据将显示在移动应用程序上，并且这个文件在每个应用程序中都会有所不同。就是这样，只有一个参数，显然不能硬编码。

如果您将在代码中使用该值，为什么不创建一个存储它的文件，并在编译时将其包含在 JS 包中？例如，一个空的 url.json 在其余代码中作为模块导入（也许您必须放置一些样板文件用于测试目的，以便在开发时不会抱怨）。然后，在构建时，将其内容替换为url: 'example.com/display-data/'。