为React Native中的CodePush设置多环境

为React Native中的CodePush设置多环境

在这篇文章中,我将指导你如何在AppCenter中为一个React Native项目在 Android 和 iOS 上设置多个环境。我们将建立三个明确的分发环境,分别用于开发、测试和生产,并配置 CodePush 以便为每个环境提供更新。

步骤1:在AppCenter中配置多个环境。

  1. 前往应用中心:选择你的应用
  2. 导航至 Distribute > CodePush > Settings
  3. 创建多个环境:点击 + New Deployment 命名你的环境,并保存它。例如:
  • Development
  • Testing
  • Production

为React Native中的CodePush设置多环境

为React Native中的CodePush设置多环境

  1. 生成 CodePush 命令:创建这些环境后,你将收到针对每个环境的特定CodePush命令。每个命令的唯一区别在于最后指定的环境。以下是一些例子:

为React Native中的CodePush设置多环境

// For Development
appcenter codepush release-react -a xxxxx/AwesomeProject -d Development

// For Testing
appcenter codepush release-react -a xxxxx/AwesomeProject -d Testing

// For Production
appcenter codepush release-react -a xxxxx/AwesomeProject -d Production

iOS应用重复这些步骤,你的AppCenter设置现在就已经完成

步骤2:针对Android的平台特定配置

编辑 android/app/build.gradle: 为 releaseDevelopmentreleaseTesting 添加两个新的发布对象,每个对象都有各自的CodePush密钥。这些名称可以由你自己选择,你可以在AppCenter中找到密钥: AppCenter->Select your Android App->Distribute->CodePush->settings

release {
       signingConfig signingConfigs.debug
       minifyEnabled enableProguardInReleaseBuilds
       proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"
       resValue "string""CodePushDeploymentKey"'xxxxxx' //Paste your CodePush Key for Production.
  }
releaseDevelopment {
       matchingFallbacks = ['release']
       signingConfig signingConfigs.release
       minifyEnabled enableProguardInReleaseBuilds
       proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"
       resValue "string""CodePushDeploymentKey"'xxxxxx' //Paste your CodePush Key for Developement.
}  
releaseTesting {
       matchingFallbacks = ['release']
       signingConfig signingConfigs.debug
       minifyEnabled enableProguardInReleaseBuilds
       proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"
       resValue "string""CodePushDeploymentKey"'xxxxxx' //Paste your CodePush Key for Testing.
 }

为React Native中的CodePush设置多环境

2.为特定环境构建:为所需环境构建应用程序的发布版本。例如,对于开发环境,将 assembleRelease 替换为 assembleReleaseDevelopment

cd android && ./gradlew clean && ./gradlew app:assembleReleaseDevelopment && cd ..

3.CodePush更新:对你的JavaScript进行更改,然后运行相应环境的CodePush命令。以下是开发环境的一个例子:

appcenter codepush release-react -a xxxxx/AwesomeProject -d Development

成功运行此命令后,前往 AppCenter -> YourProjectName -> Distribute -> CodePush 。从下拉菜单中选择你的环境,选择版本,然后点击右上角的设置(齿轮图标)。启用 Required Update 选项。

在CodePush之前

为React Native中的CodePush设置多环境

在CodePush之后:

为React Native中的CodePush设置多环境

步骤3:针对iOS的平台特定配置

Xcode 配置:

  • 打开Xcode并选择你的项目 Xcode->ProjectName
  • 在配置下, 右键 duplicate “Release 配置并添加你的环境 + icon -> Duplicate “Release” Configuration

为React Native中的CodePush设置多环境

为React Native中的CodePush设置多环境

2. Xcode中的用户自定义设置:

  • 前往构建设置并为 CodePush密钥 Build Settings -> + icon -> Add User Defined Setting 添加用户定义的设置。
  • 将你的每个环境对应的CodePush密钥粘贴到 CODEPUSH_KEY 中。

为React Native中的CodePush设置多环境

为React Native中的CodePush设置多环境

为React Native中的CodePush设置多环境

3. Info.plist 配置:

在你的项目目录中的 Info.plist 文件中,添加以下键和字符串,其中字符串与你在Xcode的用户定义设置中定义的字符串匹配:

<key>CodePushDeploymentKey</key>
<string>$(CODEPUSH_KEY)</string>

为React Native中的CodePush设置多环境

4. 为不同环境发布构建:

要为不同环境创建发布版本,请在Xcode中选择你的项目名称,前往 Edit Scheme > Archive > Build Configuration ,并选择你想要的环境。

为React Native中的CodePush设置多环境

为React Native中的CodePush设置多环境

5. CodePush更新

JavaScript进行更改,并运行相应环境的CodePush命令。以下是开发环境的一个示例:

appcenter codepush release-react -a xxxxxx/AwesomeProject-IOS -d Development

成功运行此命令后,前往 AppCenter -> YourProjectName -> Distribute -> CodePush 。从下拉菜单中选择你的环境,选择版本,然后点击右上角的设置(齿轮图标)。启用 Required Update 选项。

在CodePush之前

为React Native中的CodePush设置多环境

在CodePush之后:

为React Native中的CodePush设置多环境

你的多环境CodePush设置已经完成,适用于Android和iOS。

总结

在你的React Native项目中设置多个CodePush环境可以极大地提升你的开发、测试和生产流程。通过本指南提供的配置,你可以灵活地在不同的环境中无缝部署更新,确保更顺畅的应用开发生命周期。

请谨慎管理您的CodePush密钥和环境,确保敏感信息的安全,并遵循应用程序分发和更新的最佳实践。此外,始终在将它们推向生产环境之前,在你的测试环境中彻底测试您的CodePush更新,以确保可靠的用户体验。


原文始发于微信公众号(前端混合开发):为React Native中的CodePush设置多环境

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

文章由极客之音整理,本文链接:https://www.bmabk.com/index.php/post/251213.html

(0)
小半的头像小半

相关推荐

发表回复

登录后才能评论
极客之音——专业性很强的中文编程技术网站,欢迎收藏到浏览器,订阅我们!