跳过主要内容

设置 CI/CD 的 Capacitor 应用

了解如何使用 CI/CD pipeline 为 iOS 和 Android 应用程序优化发布流程,提高效率并减少错误。

Setting Up CI/CD for Capacitor Apps

想要更快、无错误的 iOS 和 Android 应用程序发布? CI/CD pipeline Capacitor 想更快、无错误的 iOS 和 Android 应用程序发布? Capgo.

Capacitor

  • 应用程序自动化构建、测试和部署,减少发布时间 70%、错误率 60%。本指南涵盖了从设置环境到自动化实时更新的所有内容,包括使用 Capacitor 应用: 提高构建速度78%,减少商店拒绝率60%。
  • 必备工具: Xcode, 安卓 studio, CocoaPods, 和更多。
  • 管道设置: 自动化任务,如 npx cap sync,依赖项缓存和平台特定构建。
  • Live updates with Capgo: 启用发布后更新,带有分阶段发布和回滚保障措施。

快速设置步骤:

  1. 准备环境: 安装 iOS 和 Android 所需的工具。
  2. 配置项目: 更新 capacitor.config.ts 并安全地管理环境变量。
  3. 构建管道: 为两种平台自动安装依赖项、构建和测试。
  4. 优化性能: 使用缓存、并行构建和条件工作流。
  5. 添加实时更新: 将 Capgo 与分阶段的 OTA 更新安全地集成到应用中。

通过 CI/CD,Capacitor 应用程序实现更快、更Smooth 的发布,同时减少错误和手动干预。准备优化您的工作流程?让我们开始!

集成您的现有 CI/CD Pipelines 与移动功能

准备您的 CI/CD 环境

一旦您掌握了 CI/CD 的基本知识,下一步就是设置环境。这是可靠自动化的基础。

工具和软件设置

确保您安装了这些关键工具:

对于 iOS 开发:

  • Xcode 14 或更高版本
  • Xcode 命令行工具
  • CocoaPods 用于管理依赖项

为 Android 开发

  • 安卓Studio
  • Android SDK 33 或以上
  • Java 开发工具包 (JDK)

要确认您的 Xcode Command Line Tools 已安装,请使用:

xcode-select -p

创建一个 Capacitor 项目

Capacitor 框架文档网站

您的 Capacitor 项目需要正确配置以支持 CI/CD 工作流。这个文件是设置的核心: capacitor.config.ts 这个文件确保您的项目符合 CI/CD 要求。

const config: CapacitorConfig = {
  appId: 'com.example.app',
  webDir: 'build',
  ios: { 
    scheme: 'MyApp'
  }
}

Creating a

环境设置

安全地管理凭证是将环境设置与 CI/CD pipeline 链接起来的关键部分。

需要定义的关键变量:

  • BUILD_ENV: 指定部署阶段(例如, production)
  • IOS_SIGNING_IDENTITY: 你的 code 签名证书
  • ANDROID_KEYSTORE_PATH: Android keystore 的路径

在 Android 构建中,动态生成一个 local.properties 文件在 CI 过程中:

echo "sdk.dir=$ANDROID_SDK_ROOT" > android/local.properties

在 iOS 构建中,确保您的 CI 平台支持 macOS agent。

检查您的环境是否准备好:

node --version | grep "v16" && xcodebuild -version | grep "Xcode 14" || exit 1

正确管理密钥和凭证可以显著降低应用商店拒绝的机会,正如早期统计数据所示 [1].

创建您的 CI/CD pipeline

一旦环境准备就绪,下一步就是为您的 Capacitor 应用设置CI/CD管道。这条管道应该高效地管理Web资产和本机平台构建。

安装和更新依赖项

在CI/CD环境中,管理依赖项需要严格的版本控制。从清洁的安装过程开始:

npm install --ignore-scripts
npm install @capacitor/cli

为了加快构建速度,使用依赖项缓存。例如 Azure DevOps 用户已经看到使用此设置的构建时间可以减少40-60%:

- task: Cache@2
  inputs:
    key: 'npm | "$(Agent.OS)" | package-lock.json'
    path: |
      node_modules
      android/.gradle
      ios/Pods

iOS和Android构建设置

以下是如何配置两种平台的构建:

iOS构建配置:

steps:
  - task: InstallAppleCertificate@2
    inputs:
      certSecureFile: 'certificate.p12'
      certPwd: $(P12_PASSWORD)
  - script: |
      xcodebuild -workspace ios/App/App.xcworkspace -scheme App -configuration Release -archivePath ios/App/App.xcarchive archive

Android构建配置:

cd android
./gradlew bundleRelease

测试和部署步骤

并行使用矩阵策略运行平台测试:

test:
  steps:
    - run: npm run test:unit
    - run: npm run test:e2e
    - name: Run Platform Tests
      matrix:
        platform: [ios, android]
      run: npm run test:${{ matrix.platform }}

对于部署,设置平台特定的工件处理:

平台 工件类型 发行渠道
iOS .ipa App Store Connect
Android .aab Google Play Console

使用并行构建可以显著减少管道执行时间,当配置正确时。

当您的构建被验证并打包后,您就可以继续使用Capgo(下一节中讨论)进行实时更新。

sbb-itb-f9944d2

添加 Capgo 为实时更新

Capgo Live Update Dashboard界面

将Capgo集成到您的工作流中,可以增强CI/CD流程,通过实时更新功能。以下是如何设置它的步骤:

Capgo管道配置

首先,安装 Capgo CLI 关于__CAPGO_KEEP_0__ __CAPGO_KEEP_1__

steps:
  - name: Install Capgo CLI
    run: npm install -g @capgo/cli
  - name: Configure Authentication
    env:
      CAPGO_KEY: ${{ secrets.CAPGO_API_KEY }}

CI/CD 生命周期被扩展,包含了 自动更新管理 将其整合到您的自动化构建和部署流程中。

下一步,包含上传命令在您的构建步骤之后:

- name: Upload Update
  run: |
    capgo upload --api-key $CAPGO_KEY --bundle ./build/app-release.apk
    capgo deploy v${VERSION} --channel production

For 安全更新, 配置验证设置类似于如下所示:

{
  "verification": {
    "checksum": "strict",
    "certificatePinning": true,
    "updateTimeout": 500
  }
}

Capgo Capacitor 应用程序设置特性概述

Feature Description
端到端加密 Significantly reduces deployment errors.
基于频道的部署 根据环境进行定制更新
阶段性发布 确保更新逐渐分发

OTA更新指南

在部署后跟踪这些关键指标来增强您的测试流程:

阶段性发布策略

使用分阶段发布来控制更新的分发:

- name: Staged Rollout
  run: |
    capgo deploy v1.2.3 --group "beta-users" --rollout 10%
    capgo deploy v1.2.3 --rollout 50%

更新监控

关注这些指标:

  • 采用率:目标在首24小时内达到40-60%
  • 无故障会话: 保证达到 99.5% 以上
  • 验证时间: 确保小于 500ms

如果崩溃超过可接受的水平,自动回滚:

- name: Rollback Check
  run: |
    if [ $(capgo stats --version v1.2.3 --metric crashes) -gt 2 ]; then
      capgo rollback --channel production
    fi

改进管道性能

关注三个关键领域可以显著改善管道:

构建速度优化

对于仅 web 变更,使用 npx cap sync 可以通过跳过全 native 重建来节省时间,减少重建时间约 40%。以下是如何实现条件构建的方法:

- name: Build Strategy
  run: |
    [ "$WEB_ONLY" = true ] && npx cap sync || (./gradlew assembleRelease && xcodebuild ...)

这种方法确保只重建必要的组件,从而简化流程。

版本控制自动化

简化工作流程可以通过自动化版本控制来实现。使用以下脚本来动态设置版本和构建号:

- name: Set Version
  run: |
    VERSION=$(node -p "require('./package.json').version")
    BUILD_NUMBER=$GITHUB_RUN_NUMBER
    echo "APP_VERSION=${VERSION}" >> $GITHUB_ENV
    echo "BUILD_ID=${BUILD_NUMBER}" >> $GITHUB_ENV

此配置还可以用于设置自动化语义版本管理:

{
  "scripts": {
    "version": "standard-version",
    "build:prod": "npm version patch && ionic build --prod"
  }
}

这些实践提供了一个坚实的框架,用于通过以下指标来跟踪和改进管道性能:

  • 每个阶段的构建时间
  • 缓存效率(命中/丢失比率)
  • 峰值资源使用率

多环境设置

通过使用环境特定的配置来管理多个环境可以大大简化工作流程。以下是一个示例设置:

环境 配置文件
开发 .env.dev
测试 .env.staging
生产环境 安全存储

您可以使用此脚本动态配置环境:

- name: Configure Environment
  env:
    API_KEY: ${{ secrets.ENV_SPECIFIC_API_KEY }}
    BUNDLE_ID: ${{ parameters.bundleId }}
  run: |
    echo "ENVIRONMENT=${{ parameters.environment }}" >> $GITHUB_ENV
    echo "API_ENDPOINT=${{ parameters.apiUrl }}" >> $GITHUB_ENV

将这些配置与Capgo的基于频道的部署相结合,可以实现精确、环境特定的更新。这确保了更平滑的发布和更好的应用行为控制在不同环境中。

概要

CI/CD在开发中的作用

使用CI/CD管道来提高Capacitor应用程序的工作流效率。根据行业数据,团队可以实现 50-70%的更快发布周期 通过同时进行iOS和Android构建 [3]. 40-60% [1][2].

For instance, teams leveraging Azure DevOps pipelines have automated processes such as sequential build steps and Xcode packaging. They also use parameterized environments for both development and production. This approach removes the need for manual Gradle and Xcode CLI operations, ensuring reliable artifact creation every time.

例如,使用Azure DevOps管道的团队已经自动化了顺序构建步骤和Xcode打包。他们还使用了参数化环境来支持开发和生产。这一方法消除了手动Gradle和XcodeCapgo操作的需求,确保了每次都能可靠地创建工件。

Capgo for 应用更新管理

Capgo 与 CI/CD pipeline 完美集成,实时更新应用,同时保持应用商店政策的合规性。更新只会在通过自动化测试管道的测试后才会被部署。

通过结合自动化构建和分阶段发布,团队可以实现出色的结果: 7 天内覆盖 80% 用户 在 1 小时内回滚应用。

常见的策略是并行部署多个跟踪。自动化构建用于内部测试,而分阶段发布用于目标用户群。这确保了更新既快速又安全,且由严格的自动化测试管道支持。 [1].

常见问题

如何创建一个 Capacitor 应用?

创建一个 Capacitor 应用涉及几个简单的步骤:

  1. 设置环境: 安装 Node.js 和 npm 到您的系统上。然后,使用 Ionic CLI 来启动一个新的项目,支持 Capacitor

    ionic start myApp tabs --capacitor
  2. 添加平台支持: 添加您要支持的平台,如 iOS 或 Android:

    npx cap add ios
    npx cap add android
  3. 同步您的 web code: 确保您的 web code 与本机平台保持一致,通过运行:

    npx cap sync

同步步骤对于保持应用程序在 CI/CD pipeline 中的平稳运行至关重要。有关设置环境的更多详细信息,请参阅工具部分。

继续设置Capacitor应用的CI/CD

如果您正在使用 Setting Up CI/CD for Capacitor Apps 来规划 CI/CD 自动化,连接它与 Capgo 持续集成/持续部署 为Capacitor应用程序在Capgo中配置CI/CD。 Capgo 原生构建 为Capacitor应用在Capgo原生构建中设置产品工作流程 Capgo 集成 为产品工作流程在 Capgo 集成中 CI/CD 集成 为 CI/CD 集成的实现细节 GitHub 动作集成 为 GitHub 动作集成的实现细节

Capacitor 应用的实时更新

当 web 层面的 bug 在实时更新时,通过 Capgo 直接将修复推送给用户,而不需要等待 app 商店的审批。用户在后台即可获得更新,而原生层面的变化仍然在正常的审批路径中。

最新博客

Capgo 给您所需的最佳见解,帮助您创建一个真正专业的移动应用。