Zum Hauptinhalt springen

Einrichten von CI/CD für Capacitor-Anwendungen

Erhalten Sie Einblick in die Möglichkeiten, Ihre App-Veröffentlichungen für iOS und Android zu beschleunigen und Fehler zu minimieren.

Martin Donadieu

Martin Donadieu

Inhaltsmarketer

Einrichten von CI/CD für Capacitor-Anwendungen

Möchten Sie schnellere und fehlerfreie App-Veröffentlichungen für iOS und Android? CI/CD-Pipelines für Capacitor Apps automatisieren das Bauen, Testen und Bereitstellen, wodurch die Veröffentlichungszeiten um bis zu 70% verkürzt und die Fehler um 60% reduziert werden. Capgo.

Hauptpunkte:

  • Wozu CI/CD für __CAPGO_KEEP_0__-Apps unerlässlich ist: Die Builds werden um 78% beschleunigt und die Store-Ablehnungen um 60% reduziert. Capacitor appsXcode
  • Android Studio: CocoaPods, und mehr., __CAPGO_KEEP_0____CAPGO_KEEP_0__
  • Pipeline-Einrichtung: Automatisierung von Aufgaben wie npx cap sync, Cachierung von Abhängigkeiten und plattformspezifische Builds.
  • Live-Updates mit Capgo: Aktivieren Sie post-release-Updates mit phasenweisen Rollouts und Sicherungen für Rückgängigmachung.

Schnelle Einrichtungsschritte:

  1. Vorbereitung Ihrer Umgebung: Installieren Sie die erforderlichen Tools für iOS und Android.
  2. Konfigurieren Sie Ihr Projekt: Aktualisieren Sie capacitor.config.ts und verwalten Sie Umgebungsvariablen sicher.
  3. Build-Pipelines: Automatisieren Sie die Abhängigkeitsinstallationen, Builds und Tests für beide Plattformen.
  4. Optimieren Sie die Leistung.: Verwenden Sie Caching, parallele Builds und bedingte Workflows.
  5. Fügen Sie Live-Updates hinzu.: Integrieren Sie Capgo für sichere, OTA-Updates mit phasenweisen Rollouts.

Mit CI/CD erreichen Capacitor-Apps schnellere, glattere Releases, während die Fehler und die manuelle Intervention minimiert werden. Bereit, Ihre Workflow zu optimieren? Lassen Sie uns loslegen!

Integrieren Sie Ihre bestehenden CI/CD-Pipelines mit mobilen Funktionen.

Vorbereitung Ihres CI/CD-Umgebungs

Einmal, wenn Sie die Grundlagen von CI/CD beherrschen, ist der nächste Schritt die Einrichtung Ihrer Umgebung. Dies ist der Rückgrat einer zuverlässigen Automatisierung.

Tools- und Software-Setup

Stellen Sie sicher, dass Sie diese Schlüsselwerkzeuge installiert haben:

Für iOS-Entwicklung:

  • Xcode 14 oder neuer
  • Xcode-Befehlszeilenwerkzeuge
  • CocoaPods für die Verwaltung von Abhängigkeiten

Für Android-Entwicklung:

  • Android Studio
  • Android SDK 33 oder höher
  • Java-Entwicklungs-Kits (JDK)

Um sicherzustellen, dass Ihre Xcode-Befehlszeilenwerkzeuge installiert sind, verwenden Sie:

xcode-select -p

Erstellen Sie ein Capacitor Projekt

Capacitor Framework Dokumentation Website

Ihr Capacitor-Projekt muss korrekt konfiguriert sein, um CI/CD-Workflows zu ermöglichen. Das capacitor.config.ts Datei ist das Herz dieses Setup:

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

Diese Datei stellt sicher, dass Ihr Projekt den CI/CD-Anforderungen entspricht.

Umgebungsvariablen einrichten

Sicherheitsanforderungen für die Verwaltung von Zugriffscodes sind ein wichtiger Teil der Verbindung zwischen Ihrer Umgebungsanpassung und dem CI/CD-Pipeline.

Schlüsselvariablen definieren:

  • BUILD_ENV: Legt die Bereitstellungsbühne fest (z.B. production)
  • IOS_SIGNING_IDENTITY: Ihr code-Signierungszertifikat
  • ANDROID_KEYSTORE_PATH: Pfad zu Ihrem Android-Keystore

Für Android-Builds generieren Sie dynamisch eine local.properties Datei während des CI-Prozesses:

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

Wenn Sie mit iOS-Builds arbeiten, stellen Sie sicher, dass Ihr CI-Plattform macOS-Agenten unterstützt.

Um zu überprüfen, ob Ihr Umfeld bereit ist:

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

Die ordnungsgemäße Verwaltung von Schlüsseln und Zugriffsberechtigungen kann die Chancen auf App-Store-Ablehnungen erheblich verringern, wie in früheren Statistiken erwähnt. [1].

Erstellen Sie Ihr CI/CD-Pipeline

Einmal Ihr Umfeld bereit ist, ist der nächste Schritt die Einrichtung einer CI/CD-Pipeline für Ihr Capacitor-AnwendungsprojektDiese Pipeline sollte sowohl Web-Assets als auch native Plattform-Builds effizient verwalten.

Installieren und Aktualisieren von Abhängigkeiten

In CI/CD-Umgebungen erfordert die Verwaltung von Abhängigkeiten strikte Versionskontrolle. Beginnen Sie mit einem sauberen Installationsprozess:

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

Um die Buildzeit zu verkürzen, verwenden Sie Abhängigkeits-Caching. Zum Beispiel Azure DevOps Benutzer haben mit dieser Konfiguration eine Verbesserung der Buildzeiten von 40-60% gesehen:

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

iOS- und Android-Build-Einrichtung

Konfigurieren Sie die Builds für beide Plattformen wie folgt:

iOS-Build-Konfiguration:

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-Build-Konfiguration:

cd android
./gradlew bundleRelease

Schritte für die Testung und Bereitstellung

Laufen Sie Plattformtests parallel mit einer Matrixstrategie aus:

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 }}

Für die Bereitstellung legen Sie eine plattformabhängige Artefaktverwaltung an:

Plattform Artefakttyp Verteilungschannel
iOS .ipa App Store Connect
Android .aab Google Play Console

Mit parallelen Builds kann die Ausführungszeit des Pipelines erheblich reduziert werden, wenn sie korrekt konfiguriert sind.

Once your builds are validated and packaged, you’re ready to move on to live updates with Capgo (discussed in the next section).

sbb-itb-f9944d2

Hinzufügen Capgo Capgo Live-Update-Dashboard-Interface

Capgo

Capgo-Integration in Ihre Workflow verbessert Ihr CI/CD-Prozess, indem Sie post-release-Updates ermöglichen. Hier erfahren Sie, wie Sie es einrichten:

Capgo Pipeline-Konfiguration

Installieren Sie zunächst das Capgo CLI im Umfeld Ihres Pipelines:

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

Diese Ergänzung erweitert Ihr CI/CD-Lebenszyklus, indem Sie die Verwaltung von Updates in Ihren automatisierten Build- und Bereitstellungsprozess einbeziehen. Als Nächstes fügen Sie den Upload-Befehl nach Ihren Build-Schritten ein: Für

sichere Updates

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

konfigurieren Sie die Validierungs-Einstellungen wie folgt: __CAPGO_KEEP_0____CAPGO_KEEP_1__

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

Capgo Features Übersicht

Funktion Beschreibung
End-to-End-Verschlüsselung Reduziert die Fehler bei der Bereitstellung erheblich.
Kanalbasierte Bereitstellung Anpasst Updates an spezifische Umgebungen.
Phasenweise Bereitstellung Sorgt dafür, dass Updates allmählich verteilt werden.

OTA-Update-Leitfaden

Verbessern Sie Ihre Testprozesse, indem Sie diese Schlüsselmetriken nach der Bereitstellung verfolgen:

Phasenweise Bereitstellungstrategie

Verwenden Sie eine rollierende Bereitstellung, um die Verteilung von Updates zu steuern:

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

Update-Überwachung

Beobachten Sie diese Metriken:

  • Anpassungsrate: Ziel ist eine Rate von 40-60% innerhalb der ersten 24 Stunden.
  • Crash-freie Sitzungen: Halten Sie sie über 99,5%.
  • Überprüfungszeit: Stellen Sie sicher, dass sie unter 500ms liegt.

Wenn die Anzahl der Crashes die akzeptablen Werte überschreitet, automatisieren Sie einen Rollback:

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

Verbesserung der Pipeline-Leistung

Fokussieren Sie sich auf drei Schlüsselfaktoren, um eine merkliche Verbesserung Ihrer Pipeline zu erzielen:

Leistungssteigerung bei der Buildgeschwindigkeit

Für Änderungen, die nur auf der Webseite vorgenommen werden, kann die Verwendung von npx cap sync Kann Zeit sparen, indem vollständige native Rebuilds ausgelassen werden, wodurch die Rebuildzeit um etwa 40% reduziert wird. Hier erfahren Sie, wie Sie bedingte Builds implementieren können:

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

Dieser Ansatz stellt sicher, dass nur die notwendigen Komponenten neu erstellt werden, wodurch der Prozess erleichtert wird.

Automatisierung der Versionskontrolle

Die Automatisierung der Versionskontrolle kann Ihre Workflow vereinfachen. Verwenden Sie das folgende Skript, um Versions- und Buildnummern dynamisch zu setzen:

- 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

Zusätzlich kann die automatisierte semantische Versionsnummerierung mit dieser Konfiguration eingerichtet werden:

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

Diese Praktiken bieten einen soliden Rahmen für die Erfassung und Verbesserung der Pipelineleistung durch Metriken wie:

  • Buildzeit pro Stufe
  • Cacheeffizienz (Hitz-/Fehlerraten)
  • Höchster Ressourcenverbrauch

Einrichtung mehrerer Umgebungen

Die Verwaltung mehrerer Umgebungen kann durch die Verwendung umgebungsbezogener Konfigurationen vereinfacht werden. Hier ist ein Beispiel für eine Konfiguration:

Umwelt Konfigurationsdatei
Entwicklung .env.dev
Staging .env.staging
Produktion Secure-Safe

Sie können Umgebungen dynamisch mit diesem Skript konfigurieren:

- 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

Indem Sie diese Konfigurationen mit der Capgo-basierten Kanal-basierten Bereitstellung kombinieren, können Sie präzise, umgebungsbezogene Updates durchführen. Dies stellt sicher, dass die Bereitstellung glatter und die Kontrolle über die Anwendungsverhalten in verschiedenen Umgebungen besser ist.

Zusammenfassung

Die Rolle von CI/CD im Entwicklungsprozess

Die Verwendung von CI/CD-Pipelines für Capacitor-Anwendungen erhöht die Effizienz des Workflow signifikant. Laut Branchenstudien können Teams 50-70% schnellerere Releasezyklen dank simultaner iOS- und Android-Builds [3]. Automatisierung von Aufgaben wie der Abhängigkeitsinstallation und der Plattform-Synchronisierung reduziert Fehler bei der Bereitstellung um 40-60% [1][2].

Zum Beispiel haben Teams, die Azure DevOps Pipelines nutzen, automatisierte Prozesse wie sequenzielle Build-Schritte und Xcode-Pakete implementiert. Sie nutzen auch parametrisierte Umgebungen für Entwicklung und Produktion. Diese Vorgehensweise eliminiert die Notwendigkeit für manuelle Gradle- und Xcode-Befehle CLI, um zu gewährleisten, dass Artefakte jederzeit zuverlässig erstellt werden.

Diese Verbesserungen legen den Grundstein für eine gestreamte Updateverwaltung, wenn sie mit Capgo kombiniert wird.

Capgo für Update-Verwaltung

Capgo funktioniert reibungslos mit CI/CD-Pipelines, um sofortige Updates bereitzustellen, während die Einhaltung von App-Store-Richtlinien gewährleistet wird. Updates werden nur nachdem sie automatisierte Testgattern durchlaufen sind, bereitgestellt.

Indem man automatisierte Builds mit phasenweisen Rollouts kombiniert, können Teams beeindruckende Ergebnisse erzielen: 80% der Benutzer sind innerhalb von 7 Tagen abgedeckt und Rollback-Funktionen innerhalb von einer Stunde.

Ein häufiges Vorgehen besteht darin, parallel Deployments zu führen. Automatisierte Builds werden für interne Tests verwendet, während phasenweise Rollouts auf Benutzersegmente abzielen. Dies stellt sicher, dass Updates sowohl schnell als auch sicher sind, unterstützt durch strenge automatisierte Testgatten [1].

Häufig gestellte Fragen

How Capacitor eine App zu erstellen?

Das Erstellen einer Capacitor App umfasst einige einfache Schritte:

  1. Umgebung einrichten: Installieren Sie Node.js und npm auf Ihrem System. Dann verwenden Sie den Ionic CLI , um eine neue Projekt mit Capacitor-Unterstützung zu starten:

    ionic start myApp tabs --capacitor
  2. Plattformen hinzufügen: Fügen Sie die Plattformen hinzu, die Sie targeten möchten, wie iOS oder Android:

    npx cap add ios
    npx cap add android
  3. Überprüfen Sie Ihre Web- code: Stellen Sie sicher, dass Ihre Web- code mit den native Plattformen übereinstimmt, indem Sie Folgendes ausführen:

    npx cap sync

Der Synchronisierungsprozess ist für die Gewährleistung der Konsistenz Ihrer App über Plattformen hinweg und für eine reibungslose Funktion in CI/CD-Pipelines von entscheidender Bedeutung. Weitere Informationen zur Einrichtung Ihrer Umgebung finden Sie in der Tools-Sektion.

Fortsetzen von CI/CD-Einstellungen für Capacitor-Apps

Wenn Sie __CAPGO_KEEP_0__ verwenden Einstellungen für CI/CD von Capacitor-Apps um die CI/CD-Automatisierung zu planen, verbinden Sie sie mit Capgo CI/CD zur Produktworkflow in Capgo CI/CD zur Produktworkflow in Capgo Native Builds zur Produktworkflow in Capgo Integrations Capgo Integrations zur Produktworkflow in Capgo Integrations CI/CD-Integration zur Implementierungsdetail in CI/CD-Integration, und GitHub Actions-Integration zur Implementierungsdetail in GitHub Actions-Integration

Live-Updates für Capacitor-Apps

Wenn ein Bug im Weblayer lebt, schicken Sie die Reparatur über Capgo anstatt Tage für die Genehmigung durch den App-Store abzuwarten. Die Benutzer erhalten die Aktualisierung im Hintergrund, während native Änderungen im normalen Review-Prozess bleiben.

Menschliche Unterstützung von Martin

Jetzt loslegen

Neueste Beiträge aus unserem Blog

Capgo gibt Ihnen die besten Einblicke, die Sie benötigen, um eine wirklich professionelle mobile App zu erstellen.