Zum Hauptinhalt springen

Einrichtung von CI/CD für Capacitor Apps

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

Einrichtung von CI/CD für Capacitor Apps

Möchten Sie schnellere und fehlerfreie App-Veröffentlichungen für iOS und Android? CI/CD-Pipelines für targetLanguage":"Deutsch","protectedTokens":["Cloudflare","Capacitor","GitHub","Capgo","code","API","SDK","CLI","npm","bun"],"texts":["Capacitor","Apps automatisieren das Bauen, Testen und Deployen, wodurch die Veröffentlichungszeit um bis zu 70% reduziert und die Fehler um 60% gesenkt werden können. Diese Anleitung deckt alles ab, was Sie wissen müssen, von der Einrichtung Ihrer Umgebung bis hin zur Automatisierung von Live-Updates mit","Capacitor","Hauptergebnisse:","Warum CI/CD für","Capacitor Apps"",": Beschleunigt die Builds um 78% und reduziert die Store-Ablehnungen um 60%.","Wichtige Werkzeuge","Xcode","Android Studio","CocoaPods",", und mehr."]} translations Capgo.

translations

  • translations Capacitor appstranslations
  • translations: translations, translations, translationstranslations
  • Pipeline-Einrichtung: Aufgaben wie npx cap sync, Abhängigkeits-Caching und plattform-spezifische Builds automatisieren.
  • Live-Updates mit Capgo: Post-Release-Updates mit phasenweisen Rollouts und Rollback-Sicherungen aktivieren.

Schnelle Einrichtungsschritte:

  1. Ihre Umgebung vorbereiten: Für iOS und Android erforderliche Tools installieren.
  2. Ihre Projekt konfigurieren: Aktualisieren capacitor.config.ts und Umgebungsvariablen sicher verwalten.
  3. Build-Pipelines: Automatisieren Sie die Installation von Abhängigkeiten, die Erstellung und Tests für beide Plattformen.
  4. Optimieren Sie die Leistung: Verwenden Sie Caching, parallele Builds und bedingte Workflows.
  5. Hinzufügen von Live-Updates: Integrieren Sie Capgo für sichere, OTA-Updates mit phasenweisen Rollouts.

Mithilfe von CI/CD erreichen Capacitor-Apps schnellere, glattere Releases, während die Fehler und die manuelle Eingreifens 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 die Grundlage für vertrauenswürdige Automatisierung.

Werkzeuge 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

Dein 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 dein Projekt den CI/CD-Anforderungen entspricht.

Umgebungswerte einrichten

Die sichere Verwaltung von Zugangsdaten ist ein wichtiger Aspekt bei der Verbindung deiner Umgebungs-Einrichtung mit dem CI/CD-Pipeline.

Schlüsselvariable definieren:

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

Für Android-Builds dynamisch ein __CAPGO_KEEP_0__-Signierungszertifikat generieren 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 Anmeldeinformationen kann die Chancen auf App-Store-Ablehnungen erheblich verringern, wie in früheren Statistiken erwähnt. [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 Capacitor-Projekt. Diese Pipeline sollte effizient sowohl Web-Assets als auch native Plattform-Builds verwalten.

Installieren und Aktualisieren von Abhängigkeiten

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

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

Um die Build-Zeit zu verkürzen, verwenden Sie Abhängigkeits-Caching. Zum Beispiel: 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-Konfiguration

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

iOS-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-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:

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 richtig konfiguriert sind.

Sobald Ihre Builds validiert und verpackt sind, sind Sie bereit, sich auf lebende 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 postrelease-Updates ermöglicht. Hier erfahren Sie, 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

Funktion Beschreibung
End-to-End-Verschlüsselung Reduziert die Fehler bei der Bereitstellung erheblich.
Kanalbasierte Bereitstellung Anpasst Updates an spezifische Umgebungen.
Phasenweise Rollouts Sichert Updates, indem sie allmählich verteilt werden.

OTA-Update-Leitfaden

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

Phasenweise Bereitstellungsstrategie

Verwenden Sie eine rollende Veröffentlichung, 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-Monitoring

Bleiben Sie auf diese Metriken achten:

  • Annahmegröße: Ziel 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 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 in Ihrer Pipeline zu erzielen:

Leistungssteigerung bei der Build-Speed-Optimierung

Für Web-Ä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 ist eine Beschreibung, 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 vereinfacht wird.

Automatisierung der Versionskontrolle

Die Automatisierung der Versionskontrolle kann Ihre Workflow vereinfachen. Verwenden Sie das folgende Skript, um die 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 Pipelineleistung über Metriken wie:

  • Buildzeit pro Stufe
  • Cache-Effizienz (Hit-/Miss-Verhältnisse)
  • Höchster Ressourcenverbrauch

Einstellung 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 Sichere 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 erheblich. Laut Branchenstudien können Teams 50-70% schnellerere Releasezyklen dank simultaner iOS- und Android-Builds [3]. Automatisierung von Aufgaben wie Abhängigkeitsinstallation und 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-Packaging implementiert. Sie nutzen auch parametrisierte Umgebungen für Entwicklung und Produktion. Diese Vorgehensweise eliminiert die Notwendigkeit von manuellen Gradle- und Xcode-CLI-Operationen, um zuverlässige Artefakt-Erstellung sicherzustellen.

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 Testgitter im Pipeline durchlaufen haben, bereitgestellt.

Indem man automatisierte Builds mit phasenweisen Rollouts kombiniert, können Teams beeindruckende Ergebnisse erzielen: 80% Benutzerabdeckung innerhalb von 7 Tagen und Rollback-Fähigkeiten 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 Testgitter [1].

Häufig gestellte Fragen

How Capacitor eine App zu erstellen?

Das Erstellen einer Capacitor App umfasst einige einfache Schritte:

  1. Einrichten Ihrer Umgebung: 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. 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 App konsistent über Plattformen ist und eine glatte Funktion in CI/CD-Pipelines ermöglicht. Weitere Informationen zur Einrichtung Ihrer Umgebung finden Sie im Tools-Bereich.

Fortsetzen Sie mit der Einrichtung von CI/CD für Capacitor-Apps

Wenn Sie __CAPGO_KEEP_0__ verwenden Einrichtung von CI/CD für Capacitor-Apps für die Automatisierung von CI/CD zu planen, mit ihm verbinden Capgo CI/CD für den Produktworkflow in Capgo CI/CD Capgo Native Builds für den Produktworkflow in Capgo Native Builds Capgo Integrations für den Produktworkflow in Capgo Integrations CI/CD-Integration für die Implementierungsdetails in CI/CD-Integration GitHub Actions-Integration für die Implementierungsdetails in GitHub Actions-Integration

Live-Updates für Capacitor-Anwendungsprogramme

Wenn ein Fehler im Web-Schicht lebt, liefern Sie die Reparatur über Capgo anstatt Tage zu warten, bis die Anwendungs-App genehmigt ist. Die Benutzer erhalten die Aktualisierung im Hintergrund, während native Änderungen im normalen Review-Verfahren bleiben.

Los geht's

Neueste Beiträge aus unserem Blog

Capgo bietet Ihnen die besten Einblicke, die Sie benötigen, um ein wirklich professionelles Mobilanwendungsprogramm zu erstellen.