Zum Hauptinhalt springen

CI/CD-Einrichtung für Capacitor-Apps

Erhalten Sie Einblicke in die Optimierung Ihrer App-Veröffentlichungen für iOS und Android mithilfe von CI/CD-Pipelines, um Effizienz und Fehler zu erhöhen.

CI/CD-Einrichtung für Capacitor-Apps

Erhalten 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öffentlichungszeit um bis zu 70% und die Fehler um 60% reduziert werden können. Capgo.

Hauptpunkte:

  • Warum CI/CD für __CAPGO_KEEP_0__-Apps wichtig ist: Capacitor appsWichtige Werkzeuge
  • Xcode: Android Studio, CocoaPods, , und mehr., and more.
  • Pipeline-Einrichtung: Automatisierung von Aufgaben wie npx cap sync, Cachierung von Abhängigkeiten und plattformabhängige Builds.
  • Live-Updates mit Capgo: Aktivieren von post-veröffentlichungs-Updates mit phasenweisen Rollouts und Sicherheitsmechanismen für Rollover.

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.: Nutzen 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 der vertrauenswürdigen Automatisierung.

Tools und Software-Setup

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

Für die iOS-Entwicklung:

  • Xcode 14 oder neuer
  • Xcode-Befehlszeilenwerkzeuge
  • CocoaPods zur Verwaltung von Abhängigkeiten

Für die 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.

Umgebungsbereich einrichten

Sicherheitsanforderungen für die Verwaltung von Anmeldeinformationen sind ein wichtiger Aspekt bei der Verbindung Ihres Umgebungssetup mit dem CI/CD-Pipeline.

Schlüsselvariable definieren:

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

Für Android-Builds wird 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

Das ordnungsgemäße Management von Schlüsseln und Anmeldeinformationen 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 das Einrichten einer CI/CD-Pipeline für Ihr Capacitor-AnwendungsprogrammDieses 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 eine strenge 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-Einstellungen

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 legen Sie eine plattform-spezifische 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

Integrieren Sie Capgo in Ihren Workflow, um Ihren CI/CD-Prozess zu verbessern und postveröffentlichende Updates zu 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 Update-Verwaltung im Rahmen Ihres automatisierten Build- und Deployments 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 Updateskonfigurieren Sie die Validierungs-Einstellungen wie folgt:

{
  "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 Stellt sicher, 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 Phasenweise Verteilung, 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-Monitoring

Bleiben Sie auf diese Metriken achten:

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

Wenn Crashs über akzeptable Grenzen liegen, 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 erreichen:

Leistungssteigerung bei der Buildgeschwindigkeit

Für Web-Änderungen ohne Native-Komponenten kann die Verwendung von npx cap sync Kann Zeit sparen, indem vollständige Native-Rebuilds ausgelassen werden, wodurch die Rebuild-Zeit 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 ...)

Diese Vorgehensweise 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

Darüber hinaus 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
  • Cache-Effizienz (Hitz-/Fehlerraten)
  • Höchster Ressourcenverbrauch

Multi-Umgebungs-Setup

Mehrere Umgebungen können durch die Verwendung umgebungsbezogener Konfigurationen vereinfacht werden. Hier ist ein Beispiel für eine Konfiguration:

Umgebung 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 Rollouts und eine bessere Kontrolle über die Anwendungsverhalten in verschiedenen Umgebungen.

Zusammenfassung

Die Rolle von CI/CD im Entwicklungsprozess

Die Verwendung von CI/CD-Pipelines für Capacitor-Anwendungen erhöht die Effizienz des Workflowes 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 manueller Gradle- und Xcode-CLI-Operationen, um zuverlässige Artefakt-Erstellung sicherzustellen.

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 die automatisierten Testgitter durchlaufen haben, die in die Pipeline integriert sind.

Indem man automatisierte Builds mit phasenweisen Rollouts kombiniert, können Teams beeindruckende Ergebnisse erzielen: 80% Benutzer-Abdeckung 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 ausgerichtet sind. Dies stellt sicher, dass Updates sowohl schnell als auch sicher sind, unterstützt durch rigorose automatisierte Testgitter [1].

Häufig gestellte Fragen

Wie erstellt man eine Capacitor-Anwendung?

Das Erstellen einer Capacitor-Anwendung beinhaltet einige einfache Schritte:

  1. Konfiguration Ihrer Umgebung: Installieren Sie Node.js und npm auf Ihrem System. Dann verwenden Sie den Ionic CLI zum Starten 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 z.B. 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 für die Gewährleistung einer konsistenten Anwendung über Plattformen hinweg und für eine glatte Funktion in CI/CD-Pipelines. Weitere Informationen zur Konfiguration Ihrer Umgebung finden Sie in der Tools-Sektion.

Weitermachen von Setting Up CI/CD für Capacitor-Anwendungen

Wenn Sie __CAPGO_KEEP_0__ verwenden Setting Up CI/CD für Capacitor-Anwendungen um die CI/CD-Automatisierung zu planen, verbinden Sie sie mit Capgo CI/CD zur Produktworkflow in Capgo CI/CD, Capgo Native Builds zur Produktworkflow in Capgo Native Builds, 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-Anwendungen

Bei einem lebenden Web-Schicht-Bug können Sie die Reparatur über Capgo liefern, 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.

Unterstützung durch Menschen von Martin

Jetzt loslegen

Neueste Nachrichten aus unserem Blog

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