在此阅读文章...... 1-2-3's of React Native Templates

Question

仅使用一个项目构建iOS和Android应用程序非常棒。但是，是否也可以构建具有不同名称，图标等的多个应用程序。

如果您使用相同的布局构建应用程序并且可能与功能/代码/算法的95％相同，这可能会非常有用：

不同的目标群体（适合健身，素食主义者，蔬菜，生态等的食谱应用）
不同的运动（足球，篮球，网球新闻......）
不同的客户（客户A，B和C的业务应用程序）
...

每个应用可能会有所不同的事情：

应用名称
应用图标
闪屏
设计
设置（API网址，...）
某些代码（默认功能/组件可能会被基于应用的自定义文件覆盖）

如果你有一个目录 flavors ，你可以把所有你想用的文件覆盖在默认的代码库中，这可能是一个完美的解决方案。

有人在这里发布了类似或任何想法如何解决这个问题？

Answer 1

这是我过去几天在项目中解决的问题。到目前为止，我认为我有一些好的（不完美的）解决方案。

想法。我们没有任何内置函数来帮助我们处理这种情况，因此我们可以使用一些可以完成工作的外部操作。我们需要的只是多个Android和iOS项目以及单个JS代码库。

实施。我来到这个项目结构：

IOS
机器人
管理器
SRC

ios和android文件夹是众所周知的，它们是本机项目文件夹。

src是一个包含JS代码的文件夹，您可以随意组织它

manager是最有趣的一个。这里我们可以存储多个本机项目文件。我们可以在其中包含多个本机项目文件夹，例如app1-android app1-ios app2-android app2-ios。当我们想要处理app1时，我们只需将app1-ios和app1-android复制到我们的根ios和android文件夹，因此实际项目为{{1} }}。完成app1后，我们可以将app1和android个文件夹保存到ios，然后将manager和app2-ios复制到root { {1}}和app2-android。我们都很善于发展我们的ios。

我们可以手动完成。但我们是开发人员，我们可以让它变得更容易。我编写了一个PHP脚本，使android和app2从php save.php -a app1复制到root并向后复制。此外，它负责不复制一些不重要的工作人员（在ios中的pods文件夹，在android等中构建）并运行php set.php -a app1以确保我们在实际项目中拥有所有pod。

我坚持使用一个manager文件来安装所有npm模块，因此我不必在每次项目切换后运行pod install。

毕竟，我们可以在一个回购中拥有我们希望的项目，我们可以独立定制每个项目。

PS 如果你想让我分享我的脚本，我会尽可能快地完成它（需要一些时间为github做准备并写一些更详细的说明），让我吧知道。

Answer 2

您可以使用多个目标。

您可以通过以下步骤创建目标：

转到项目导航器 - ＆gt;右键点击目标下的应用名称 - ＆gt;选择复制 - ＆gt;从弹出窗口选择Duplicate only。

你会发现重复的目标。现在，您可以在资产中使用另一个或多个app icon和launch image，并为该目标设置它。

请参阅下面的屏幕截图以便更好地理解！

因此，选择新归结的目标并通过从general标签中选择来进行更改。

您可以参考this great tutorial by Appcoda!

Answer 3

我为每个平台（iOS / Android）提供了大约100种不同的原生应用程序，共享相同的代码库。我现在管理这个设置大约2年了，我仍然很满意。

以下是iOS部分：

我使用具有不同plist / pch个文件的目标。

将每个应用程序不同的文件保存在一个单独的目录中，由应用程序名称命名。如果将文件添加到项目中，请检查相应的目标：

通过使用相同的文件名，您可以＆＃34;覆盖＆＃34;不同目标的文件。

Android部分：

我使用一个gradle模块作为公共部件，每个app使用一个模块进行自定义。我还使用gradle变量进行常见值定义（minSdkVersion，compileSdkVersion等）。每个应用只有以下设置不同：applicationId，versionCode，versionName。以下是自定义应用的示例文件：

apply plugin: 'com.android.application'

android {
    compileSdkVersion rootProject.ext.compileSdkVersion
    buildToolsVersion rootProject.ext.buildToolsVersion

    defaultConfig {
        applicationId "..."
        minSdkVersion rootProject.ext.minSdkVersion
        targetSdkVersion rootProject.ext.targetSdkVersion
        versionCode 28
        versionName "1.0"
    }
    signingConfigs rootProject.ext.signingConfigs

    buildTypes {
        release {
            minifyEnabled false
            proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
            signingConfig signingConfigs.release
        }
    }

}

dependencies {
    compile project(':apps:common')
}

您可以覆盖应用程序模块的相应res文件夹中的资源（应用程序图标，图像，字符串等）（对同一资源使用相同的文件名）。

不要忘记将所有模块都包含在settings.gradle。

中

Answer 4

我写了关于this table的文章，它应该会带你走近你的目标。

TLDR;是它为您提供了一种设置项目样板的方法，以便您重用所有npm和本机依赖项（本机依赖项会自动链接到您）。这绝对可以帮助你......

应用名称
设计
设置
默认代码/帮助

我认为它不会帮助你...

应用图标
启动画面

基本上，它可以帮助您复制项目根目录（./）和app（./app）文件夹中的任何内容，但./ios或{{1}中没有任何内容文件夹，除非它们作为依赖项包含在内。可能有一种方法可以将App Icons和Splash Screens作为依赖项，但我不确定。如果你搞清楚了，请告诉我。

在此阅读文章...... 1-2-3's of React Native Templates

Answer 5

我们会做一些类似于你想做的事情，但是在一个更有限的范围内。我们有各种版本的应用程序，每个版本都有名称，徽标，设计，API URL ......

它仅适用于Android，因此它基本上是上面评论中提到的一些风格。（我不知道iOS的等效系统是什么）

但我们也使用https://github.com/luggit/react-native-config提供了一种在本机（Android和iOS）和javascript代码之间共享这些特定变量/设置的方法。您只需设置一个.env.myversion文件，其中包含您需要的设置，例如：

API_URL=https://my.server.com/ LOGO_FILE=/path/to/the/right/logo COLORSET=shades_of_blue

正确的文件在构建时被拉入，因此您的应用程序具有每个设置的正确版本，然后您可以在代码中调用这些变量，并根据您使用的版本进行分支。好处是它可以在任何地方使用。这样做的缺点是，如果你在JS层中拥有所有这些内容而不是在带有flavor的构建系统中定义它，那么你可能会在应用程序中添加一些额外的东西。我想这是根据您的用例需要决定的便利性和性能/效率之间的权衡。

Answer 6

在Xcode中，您可以简单地复制目标并使用新的plist创建一个新目标，这意味着您可以根据需要更改应用程序名称，图标，初始包和其他设置。

Answer 7

在XCode中，您可以在单个项目中为不同的应用程序制作不同的构建配置（意味着Dev，alpha，beta，Prod，Debug，Release），借助此解决方案，您可以更改AppName，AppIcon，BundleId ，URL，SplashScreen等适用于不同版本。

Answer 8

我创建了一个网站，用户可以在其中指定其内容，图标，名称和包名称，以及许多其他选项，例如在应用中包含广告SDK。小额付款后，用户可以手动创建带证书或签名应用的APK。生成apk需要几秒钟。 APK已准备好上传到PlayStore。这个项目价格很高，但我的客户很高兴。

怎么做？

为代码创建一些模板。你可以在某些网站上购买。
将可选代码拆分为单独的文件
如果您不能将代码拆分到单独的文件中（例如，对于AndroidManifest.xml），您可以在某些键中添加注释（后处理说明）
从用户内容/指定图标生成图标。
根据用户请求，只需将所有选定的文件复制到同一目录中，使用简单的文本处理器删除不必要的代码（使用步骤3中的注释），将其压缩，将APK发送给用户。

Answer 9

基本上有两种不同的选择：

选项1：OS Builds / android flavors：

在响应本机项目中，使用iOS 内部版本和/或android 风味有一些缺点：

本机链接仅链接Xcode上的第一个目标。您必须手动链接库以获取更多目标。但是，在本机0.60+中，会自动链接，可以使用little tweak固定到podfile
如果应用程序ID与程序包ID不同，React-native run-android可能无法启动该应用程序。
要维护一个本地项目并包含一个项目中包含的所有不同构建/风格以及所有资产和资源，可能会很复杂。
需要使用xcode和android studio / gradel的一些额外知识。

选择2：采用原生方式（我个人更喜欢）

基于Roman Osypov的答案，我想出了一种实现方法。

当前，每个本机项目都有两个本机文件夹ios和android，每个文件夹代表平台的本机项目。

让我们假设我们有两个具有相同代码库但资源/资产等不同的包/应用。

CabApp TaxiApp

主要思想是交换根ios和android文件夹，并将其与“本地”源保持同步。

在项目的根目录中创建一个名为natives的文件夹
将主项目的当前ios和android文件夹复制到 natives文件夹，假设它是CabApp，然后重命名这些文件夹分为以下几类：CabApp-ios CabApp-android
对TaxiApp执行相同的操作，但请记住更改bundleId，本地项目的标识符，资产等。
删除项目根目录中的ios和android主文件夹并为其添加.gitignore
安装以下开发依赖项yarn add -D rimraf sync-directory ttab
现在第一次提取项目时，您需要设置“应用” 例如，如果您想使用TaxiApp，则可以执行以下内容：yarn ios-TaxApp，您可以在以下脚本中定义 package.json

yarn rimraf ios && yarn rimraf android && yarn syncdir natives/TaxiApp-ios ios -c && yarn syncdir natives/TaxiApp-android android -c && cd ios && pod install && yarn

基本上，此命令删除根文件夹ios + android，并将文件夹从natives文件夹同步到根文件夹。

最后一步是同步并观看从“ temp” ios和android文件夹到natives相应应用平台的修改。现在，例如在ios的启动脚本中，您可以添加以下脚本 yarn ios-TaxiApp，您可以将其定义为：

yarn ttab 'yarn syncdir ios natives/TaxiApp-ios -w -c' & yarn ttab 'yarn syncdir android natives/TaxiApp-android -w -c' & yarn ttab 'yarn react-native run-ios --simulator=\"iPhone 11\"'

如何使用不同的应用程序名称，图标，设置从一个项目构建多个应用程序，

9 个答案:

在此阅读文章...... 1-2-3's of React Native Templates

选项1：OS Builds / android flavors：

选择2：采用原生方式（我个人更喜欢）