Zum Hauptinhalt springen

Einstellung von CI/CD für Capacitor-Anwendungen

Erfahren Sie, wie Sie Ihre App-Veröffentlichungen für iOS und Android mit CI/CD-Pipelines optimieren können, um die Effizienz zu steigern und Fehler zu reduzieren.

Martin Donadieu

Martin Donadieu

Content-Marketing-Manager

Einstellung 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 Zeit bis zum Release um bis zu 70% reduziert und die Fehler um 60% verringert werden können. Diese Anleitung umfasst alles, was Sie wissen müssen, von der Einrichtung Ihrer Umgebung bis hin zur Automatisierung von Live-Updates mit Capgo.

Hauptpunkte:

  • Warum CI/CD für Capacitor-Appswichtig ist: Beschleunigt das Bauen um 78% und verringert die Store-Ablehnungen um 60%.
  • Wichtige Werkzeuge: Xcode, Android Studio, CocoaPods, und mehr.
  • Pipeline-Einrichtung: Aufgaben wie npx cap sync, Abhängigkeitscaching und plattformabhängige Builds automatisieren.
  • Live-Updates mit Capgo: Post-Release-Updates mit phasenweisen Rollouts und Rollback-Sicherungen aktivieren.

Schnelle Einrichtungsschritte:

  1. Vorbereiten Sie Ihr Umfeld: 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 Installation von Abhängigkeiten, die Erstellung und die 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 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 Command Line Tools
  • CocoaPods für die Verwaltung von Abhängigkeiten

Für Android-Entwicklung:

  • Android Studio
  • Android SDK 33 oder höher
  • Java Development Kit (JDK)

Um sicherzustellen, dass Ihre Xcode Command Line Tools installiert sind, verwenden Sie:

xcode-select -p

Erstellung eines Capacitor Projekt

Capacitor Framework Dokumentation Website

Ihr Capacitor Projekt muss korrekt konfiguriert sein, um CI/CD-Workflows zu unterstützen. Die capacitor.config.ts Datei steht im Mittelpunkt dieser Einrichtung:

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

Sicherheitsaspekte bei der Verwaltung von Anmeldeinformationen sind ein wichtiger Teil der Verbindung zwischen der Umgebungs-Einrichtung und dem CI/CD-Pipeline.

Schlüsselvariablen definieren:

  • BUILD_ENV: Legt den Bereitstellungsbetrieb fest (z.B. production)
  • IOS_SIGNING_IDENTITY: Ihr code Signierungszertifikat
  • ANDROID_KEYSTORE_PATH: Pfad zu Ihrem Android-Keystore

Für Android-Builds dynamisch ein local.properties __CAPGO_KEEP_0__ 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 Anmeldeinformationen kann die Chancen auf App-Store-Ablehnungen erheblich verringern, wie in früheren Statistiken angegeben. [1].

Erstellung Ihres CI/CD-Pipelines

Einmal Ihr Umfeld bereit ist, ist der nächste Schritt die Einrichtung eines CI/CD-Pipelines für Ihr __CAPGO_KEEP_0__-Projekt. Capacitor appInstallieren und Aktualisieren von Abhängigkeiten

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

Um die Build-Zeit zu verkürzen, verwenden Sie Abhängigkeits-Caching. Zum Beispiel:

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

Azure DevOps Azure DevOps Benutzer haben eine Verbesserung der Buildzeiten von 40-60% mit dieser Konfiguration erlebt:

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

iOS- und Android-Build-Einrichtung

Hier erfahren Sie, wie Sie die Builds für beide Plattformen konfigurieren:

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 zur Überprüfung und Bereitstellung

Führen Sie Plattformtests parallel mit einer Matrixstrategie durch:

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 setzen Sie eine plattform-spezifische Artefaktverwaltung ein:

PlattformArtefakttypVerteilungschannel
iOS.ipaApp Store Connect
Android.aabGoogle Play Console

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

Sobald Ihre Builds validiert und verpackt sind, sind Sie bereit, sich auf lebendige Updates zu konzentrieren mit Capgo (erörtert im nächsten Abschnitt).

sbb-itb-f9944d2

Hinzufügen Capgo für Live-Updates __CAPGO_KEEP_0__ Live-Update-Dashboard-Interface

Capgo Live Update Dashboard Interface

Die Integration von Capgo in Ihren Workflow verbessert Ihren CI/CD-Prozess, indem sie postveröffentlichungsbezogene Updates ermöglicht. Hier ist, wie Sie es einrichten können:

Capgo Pipeline-Konfiguration

Zuerst installieren Sie das Capgo CLI in Ihrem Pipeline-Umgebung:

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 das Update-Management in Ihren automatisierten Build- und Bereitstellungsprozess einbeziehen.

Als nächstes fügen Sie den Upload-Befehl nach Ihren Build-Schritten ein:

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

Für sichere Updates, konfigurieren Sie die Validierungs-Einstellungen wie folgt:

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

Capgo Funktionen Übersicht

FunktionBeschreibung
End-to-End-VerschlüsselungReduziert die Fehler bei der Bereitstellung erheblich.
Kanalbasierte BereitstellungAnpasst Updates an spezifische Umgebungen.
Phasenweise UpdatesSichert Updates durch eine schrittweise Verteilung.

OTA-Update-Richtlinien

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

Phasenweise Bereitstellungsstrategie

Verwenden Sie eine rollende Einführung, um zu bestimmen, wie Updates verteilt werden:

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

Update-Überwachung

Bleiben Sie auf diese Metriken achtsam:

  • Annahmegrade: Ziehen Sie es auf 40-60% innerhalb der ersten 24 Stunden.
  • Crash-freie Sitzungen: Halten Sie es über 99,5%.
  • Verifizierungszeit: Stellen Sie sicher, dass es unter 500ms liegt.

Wenn Crashs über akzeptable Grenzen hinausgehen, automatisieren Sie eine Rückschaltung:

- 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 in Ihrer Pipeline merkliche Verbesserungen zu erzielen:

Optimierung der Build-Geschwindigkeit

Für Änderungen, die nur im Web 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 ist eine Beschreibung, wie Sie bedingte Builds implementieren können:

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

Diese Vorgehensweise stellt sicher, dass nur die notwendigen Komponenten neu erstellt werden, wodurch der Prozess vereinfacht wird.

Automatisierung der Versionskontrolle

Die Automatisierung der Versionskontrolle kann Ihren 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 mit dieser Konfiguration auch eine automatisierte semantische Versionsnummerierung 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 Pipeline-Performance mithilfe von Metriken wie:

  • Buildzeit pro Stufe
  • Cache-Effizienz (Hitz-/Fehlerraten)
  • Peak-Ressourcenverbrauch

Einrichtung mehrerer Umgebungen

Mehrere Umgebungen können durch die Verwendung umgebungsbezogener Konfigurationen vereinfacht werden.

UmgebungKonfigurationsdatei
Entwicklung.env.dev
Staging.env.staging
ProduktionSichere Tresore

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

Die Kombination dieser Konfigurationen mit Capgo’s channel-basierten Bereitstellung ermöglicht präzise, umgebungsbezogene Updates. Dies sichert glattere Bereitstellungen und bessere Kontrolle über die Anwendungsverhalten in verschiedenen Umgebungen.

Zusammenfassung

CI/CD-Rolle in der Entwicklung

Die Verwendung von CI/CD-Pipelines für Capacitor-Anwendungen erhöht den Workflow-Effizienz deutlich. Nach Angaben von Branchenstudien können Teams 50-70% schnellerere Releasezyklen dank simultaner iOS- und Android-Builds Danke an die gleichzeitige Erstellung von iOS- und Android-Anwendungen [3]. Durch die Automatisierung von Aufgaben wie der Installation von Abhängigkeiten und der Synchronisierung von Plattformen verringert sich die Fehlerquote bei der Bereitstellung um 40-60% [1][2].

Zum Beispiel nutzen Teams, die Azure DevOps-Pipelines nutzen, automatisierte Prozesse wie sequenzielle Build-Schritte und Xcode-Packaging. Sie nutzen auch parametrisierte Umgebungen für Entwicklung und Produktion. Diese Vorgehensweise eliminiert die Notwendigkeit manueller Gradle- und Xcode-CLI-Operationen, um sicherzustellen, dass Artefakte jederzeit zuverlässig erstellt werden.

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

Capgo für Aktualisierungsverwaltung

Capgo funktioniert reibungslos mit CI/CD-Pipelines, um sofortige Aktualisierungen bereitzustellen, während die Einhaltung von App-Store-Richtlinien gewährleistet wird. Aktualisierungen werden nur nachdem sie die automatisierten Testgatter durchlaufen haben, die in die Pipeline integriert sind.

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 verfügbar.

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 Testgatter [1].

Häufig gestellte Fragen

Wie erstellt man eine Capacitor-Anwendung?

Das Erstellen einer Capacitor-Anwendung umfasst einige einfache Schritte:

  1. Umgebung einrichten: Installieren Sie Node.js und npm auf Ihrem System. Dann verwenden Sie den Ionic CLI zum Erstellen eines neuen Projekts mit Capacitor-Unterstützung:

    ionic start myApp tabs --capacitor
  2. Hinzufügen von Plattformunterstützung: Fügen Sie die Plattformen hinzu, die Sie ansteuern möchten, wie iOS oder Android:

    npx cap add ios
    npx cap add android
  3. Synchronisieren 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 entscheidend, um sicherzustellen, dass Ihre Anwendung konsistent ist und eine glatte Funktion in CI/CD-Pipelines bietet. Weitere Informationen zur Einrichtung Ihrer Umgebung finden Sie in der Tools-Sektion.

Live-Updates für Capacitor-Apps

Wenn ein Web-Schicht-Bug live ist, versenden Sie die Reparatur über Capgo anstatt Tage zu warten, bis die App-Store-Zulassung genehmigt ist. Die Benutzer erhalten die Aktualisierung im Hintergrund, während native Änderungen im normalen Review-Prozess bleiben.

Los geht's

Neueste von unserem Blog

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