微软将停用 App Center：React Native 开发者该用什么替代品？

对 React Native 开发者来说，这可是个大消息：微软宣布他们将在 2025 年 3 月 31 日停用 Visual Studio App Center。

我们在 Infinite Red 已经使用 App Center 作为许多 React Native 咨询客户的 CI/CD 管道和开发工作流的重要部分多年了。App Center 具备很多有用的功能：

• 构建：用于 iOS 和 Android 的云构建服务
• 测试：在真实的 iOS 和 Android 设备上进行设备测试
• 分发：部署到测试人员和应用商店
• CodePush：直接向用户设备部署更新
• 分析和诊断：崩溃报告和使用分析

这些功能集成在一个地方非常方便，但既然微软要停用它，我们就需要寻找一些替代方案。

为什么微软要停用 App Center？

我并不认为这是微软在撤回他们对 React Native 的巨大投资。毕竟，微软主导了 React Native 发布团队，维护着 React Native Windows / macOS、React Native Test App、rnx-kit 等等。而且他们在 Office 应用、Skype 甚至 Windows 中使用了 React Native。微软正在越来越多地投资于 React Native。

有一个理论（没有内部消息）：App Center 的许多服务都是免费的，这种商业模式不可持续，即使它在使用 React Native 的公司中很受欢迎。似乎不可避免的是，除非它成为收入来源，否则 App Center 终将停用。

虽然这是个坏消息，但没关系——我们有一些很好的替代方案！

根据我们丰富的 React Native 经验，我们有一些强有力的推荐。简而言之：使用 EAS（Expo Application Services）作为构建管道和 OTA 更新，使用 GitHub Actions 或 CircleCI 进行自动化测试，使用 Sentry 进行错误跟踪和监控。

什么是 EAS？

EAS 是由 Expo 团队开发的一套云服务，旨在简化 Expo 和纯 React Native 项目的构建、部署和更新。（你不需要使用 Expo 就可以使用 EAS！）

一些关键功能包括：

• EAS Build：为 iOS 和 Android 提供托管的云构建，无需复杂的本地工具设置。
• EAS Submit：自动提交应用到 Apple App Store 和 Google Play Store。
• EAS Update：直接向应用部署更新，类似于 CodePush。

EAS 的美妙之处在于所有部分协同工作。你可以从代码到生产建立一个顺畅的工作流，并且具有灵活性，可以根据需求进行定制。EAS 还完全专注于 React Native，而 App Center 则是更通用的移动应用服务。Expo 团队在 React Native 生态系统中有多年的经验，他们的服务非常适合 React Native 应用。

什么是 Sentry？

Sentry 是一个流行的错误和性能监控平台。它帮助开发者识别、分类和修复代码中的问题，支持多种平台和语言。Sentry 可以为你的 React Native 应用提供非常重要的见解，保持应用稳定和高性能。我们多年来一直使用 Sentry，它确实是同类产品中的佼佼者。

对于 React Native 应用，Sentry 提供一些非常不错的功能：

• 错误监控：从你的 JavaScript 代码、本地代码和第三方库中捕获并聚合错误。
• 性能监控和分析：通过采样程序的调用栈跟踪软件性能，在各种环境中获取函数级信息，优化程序性能。
• 发布健康监控：比较版本间的崩溃率、失败率和性能，快速识别问题版本。
• 设备数据：查看设备详情如型号、操作系统、方向等，更快复现错误。
• 面包屑：通过自动收集的事件日志了解用户在发生错误前的操作。
• 会话回放：目前 React for web 有会话回放功能，React Native 也很快会有。

Sentry 非常重视 React Native 的用户体验。他们的文档非常好且相关性强。

迁移指南

从 App Center Build 迁移到 EAS Build

EAS Build 是 App Center Build 的一个非常自然的替代品，尤其是对 React Native 开发者。它提供 iOS 和 Android 的托管云构建，无需复杂的本地工具设置。

迁移步骤：

1. 使用 npm i -g eas-cli 安装最新的 EAS CLI。
2. 在项目目录中运行 eas init 设置 EAS 配置。
3. 使用 eas login 登录。
4. 通过运行 eas build:configure 在 eas.json 中设置构建配置。
5. 运行 eas build 启动第一个构建。

详细步骤请参考 EAS Build 文档。

从 App Center Test 迁移到 GitHub Actions / CircleCI

如果你还没有设置其他测试 CI 服务，我们推荐 GitHub Actions 或 CircleCI。我们团队多年来一直使用它们，实际上从未在初步评估后使用过 App Center Test。

GitHub Actions

如果你使用 GitHub，GitHub Actions 是你的最佳选择。它会自动配置环境变量，设置起来稍微简单一些。以下是一个 Android React Native 配置示例：

name: GitHub Actions

on: [push, pull_request]

jobs:
  build:
    runs-on: ubuntu-latest
    container: reactnativecommunity/react-native-android
    steps:
    - uses: actions/checkout@v2
    - name: Envinfo
      run: npx envinfo
    - name: Build application
      run: yarn install && cd android && chmod +x gradlew && ./gradlew assembleRelease

如果你想进行 iOS 构建，需要 macOS 镜像，成本约为每次构建的 8-10 倍。我们正在制作一个 Ignite Cookbook 食谱来解决这个问题，当我们完成时会更新文章（如果我忘记了，请通过电子邮件提醒我！）

CircleCI

如果你不使用 GitHub 或有其他原因不想使用 GitHub Actions，我们发现 CircleCI 是一个很好的替代品。在我们的 Ignite Cookbook 中，有一个用于 CircleCI 的 React Native 食谱。

CircleCI 与 GitHub Actions 类似，提供相对便宜的 Android 构建，以及通过 macOS 机器进行的 iOS 构建，成本约为 Linux 构建的 8-10 倍。

EAS Build Test

EAS Build 也提供了一个非常早期的通过 Detox 进行端到端测试的服务，如果你有兴趣，可以试试。

从 App Center Distribution 迁移到 EAS Submit
EAS Submit 让你可以轻松地将应用构建分发给测试人员和应用商店，是 App Center Distribution 的一个很好的替代品。

设置 EAS Build 后，可以使用 eas submit 将构建上传到 Apple App Store 或 Google Play Store。EAS 会处理将构建发送给相应审核员的过程。

对于 iOS 的 TestFlight 分发，你也可以使用 eas submit --platform ios --non-interactive 上传构建并自动发送给 TestFlight 测试人员。

请查看 EAS Submit 文档 以获取更多信息。

从 App Center CodePush 迁移到 EAS Update

App Center 最常用的功能之一是使用 CodePush 进行 OTA（“空中”）更新。以下是从 CodePush 迁移到 EAS Update 的高层指南：

1. 通过移除 react-native-code-push 包和在 JS 和本地代码中的任何引用来卸载 CodePush SDK。
2. 确保项目中有一个包含 expo 对象的正确 app.json 文件。
3. 通过运行 npx install-expo-modules@latest 安装 expo 包。
4. 使用 npm i -g eas-cli 安装最新的 EAS CLI。
5. 使用 eas login 登录你的 Expo 账号。
6. 按照 EAS Update 指南从第 4 步开始配置项目的 EAS Update，构建并部署更新。
7. 测试应用以验证更新是否正常工作。安装当前的应用商店版本，使用 EAS 部署新更新，然后启动应用以查看更新。
8. 重新构建应用并将新的更新启用版本提交到应用商店。

这只是一个概述——请务必遵循详细的 EAS Update 迁移指南 进行具体步骤。Expo 最近也发布了一篇博客文章介绍这一点。另外，查看 EAS Update 文档 帮助你配置应用何时检查更新。

从 App Center Analytics & Diagnostics 迁移到 Sentry

从 App Center 的分析和崩溃报告切换到 Sentry 相对简单：

1. 注册一个 Sentry 账号并创建一个新项目。
2. 在应用中安装 Sentry SDK（1500 星）npm i @sentry/react-native。
3. 在应用入口文件中初始化 Sentry（或 Ignite 内置的位置）。
4. 部署应用并开始在 Sentry 仪表板中查看错误报告和分析数据。

Sentry 的 React Native 文档 有更详细的说明，如果你更喜欢 Expo 的 Sentry 文档，它们也很不错。

你还可以考虑在 Sentry 中设置发布健康追踪，以监控无崩溃用户和会话。这类似于 App Center 提供的分析数据。

自托管 EAS 和 Sentry

EAS 和 Sentry 都有相当慷慨的免费层，但如果你需要的比免费层提供的更多且成本过高，你可以自己处理这些事情。

值得注意的是，两者都有付费层，这意味着……也许它们不会像 App Center 那样关闭。🫠

对于 EAS，你可以进行本地构建，而不是依赖它们的服务器。顾名思义，你可以在本地机器或自己的基础设施上运行它们。这里是 相关文档。

eas build --platform android --local

我们已经为一些客户使用 GitHub Actions 设置了这个——如果你希望我们为你设置这个，随时联系我们。

对于 Sentry，有一个使用 Docker 的基础自托管选项。这里是 相关文档。

需要帮助？

这个迁移可能会让人觉得有些复杂——特别是如果你的项目比较复杂。嗯……我的公司可以帮忙！

自 2015 年 React Native 发布以来，我们一直在构建 React Native 应用，这是我们唯一的工作。我们有在美国和加拿大多年的 React Native 专家。联系我们，我会为你组建一个 2-4 人的顾问团队，帮助你：

计划从 App Center 的迁移
为你的项目配置 EAS / Sentry
更新你的构建、部署和监控管道
培训你的团队有效维护和使用 EAS、Sentry 和 React Native
直接给我发邮件：我的名字（jamon）在 infinite dot red。或者在我们的网站上提交请求。

计划在今年 7 月（2024 年）来参加美国最好的 React Native 会议 Chain React？务必打个招呼！

首发于公众号 大迁世界，欢迎关注。📝 每周一篇实用的前端文章 🛠️ 分享值得关注的开发工具 ❓ 有疑问？我来回答

本文 GitHub https://github.com/qq449245884/xiaozhi 已收录，有一线大厂面试完整考点、资料以及我的系列文章。