Zum Hauptinhalt springen
Capacitor

Aktualisierung von Capacitor 4 zu Capacitor 5: Ein Schritt-für-Schritt-Leitfaden

Erfahren Sie, wie Sie Ihr Projekt von Capacitor 4 zu Capacitor 5 mit minimalen Bruchstellen aktualisieren können, einschließlich der Aktualisierung von offiziellen Plugins und erforderlichen Tools.

Martin Donadieu

Martin Donadieu

Content-Marketing-Manager

Aktualisierung von Capacitor 4 zu Capacitor 5: Ein Schritt-für-Schritt-Leitfaden

Im Vergleich zu vorherigen Updates beinhaltet die Übergang von Capacitor 4 zu Capacitor 5 minimalen Bruchstellen. Dieser Leitfaden bietet Schritt-für-Schritt-Anweisungen für die Aktualisierung Ihres Projekts zu Capacitor 5 sowie eine Liste der Bruchstellen für offizielle Plugins.

Hinweis: Capacitor 5 erfordert NodeJS 16 oder höher, da Node 12 am Ende seines Lebenszyklus angelangt ist und Node 14 am 30. April 2023 am Ende seines Lebenszyklus angelangt sein wird. Es wird empfohlen, die neueste LTS-Version von NodeJS zu verwenden.

  1. Installieren Sie die latest Version von Capacitor CLI in Ihrem Projekt:

    npm i -D @capacitor/cli@latest
  2. Führen Sie den folgenden Befehl aus, um der CLI die Migration zu übernehmen:

    npx cap migrate

    Wenn keine Migrationsschritte erreicht werden können, werden weitere Informationen im Terminalausgabe bereitgestellt. Die manuellen Migrationsschritte sind unten aufgeführt.

  3. Wenn Sie die VS Code-Erweiterung installiert haben, überprüfen Sie die Empfehlungen in der Erweiterung, um die Option zu finden, Ihr Projekt auf Capacitor 5 umzustellen.

Upgrade von Capacitor 4 iOS-Projekt auf Capacitor 5

  1. Upgrade von Xcode: Capacitor 5 erfordert Xcode 14.1+.

  2. Update von .gitignore: Führen Sie die folgenden Änderungen an Ihrem .gitignore Datei:

    - App/Podfile.lock
    + App/output
  3. Update von Assets, um ein einzelnes App-Icon zu verwenden: Xcode 14 unterstützt ein einzelnes App-Icon der Größe 1024x1024. Räumen Sie Ihr AppIcon.appiconset auf, indem Sie alle überflüssigen Größen entfernen.

Upgrade von Capacitor 4 Android-Projekt auf Capacitor 5

  1. Android Studio aktualisieren: Capacitor 5 erfordert Android Studio Flamingo | 2022.2.1 oder neuer, da Gradle 8 verwendet wird, das Java JDK 17 erfordert. Java 17 ist in Android Studio Flamingo enthalten, daher sind keine zusätzlichen Downloads erforderlich.

  2. AGP Upgrade Assistant ausführen: Android Studio kann bei einigen Updates im Zusammenhang mit Gradle und der Umstellung von Paketen in Build-Dateien helfen. Um zu beginnen, führen Sie Tools -> AGP Upgrade Assistant.

  3. Projektvariablen in Ihremupdate variables.gradle : Aktualisieren Sie in Ihrem

    minSdkVersion = 22
    compileSdkVersion = 33
    targetSdkVersion = 33
    androidxActivityVersion = '1.7.0'
    androidxAppCompatVersion = '1.6.1'
    androidxCoordinatorLayoutVersion = '1.2.0'
    androidxCoreVersion = '1.10.0'
    androidxFragmentVersion = '1.5.6'
    coreSplashScreenVersion = '1.0.0'
    androidxWebkitVersion = '1.6.1'
    junitVersion = '4.13.2'
    androidxJunitVersion = '1.1.5'
    androidxEspressoCoreVersion = '3.5.1'
    cordovaAndroidVersion = '10.1.1'
  4. file:

    # build.gradle
    dependencies {
    -       classpath 'com.google.gms:google-services:4.3.13'
    +       classpath 'com.google.gms:google-services:4.3.15'
    }
  5. Werte auf die folgenden neuen Mindestwerte::

    # build.gradle
    dependencies {
    -       classpath 'com.android.tools.build:gradle:7.2.1'
    +       classpath 'com.android.tools.build:gradle:8.0.0'
    }
  6. Google Services aktualisieren:

    # gradle-wrapper.properties
    distributionBase=GRADLE_USER_HOME
    distributionPath=wrapper/dists
    - distributionUrl=https\://services.gradle.org/distributions/gradle-7.4.2-all.zip
    + distributionUrl=https\://services.gradle.org/distributions/gradle-8.0.2-all.zip
    zipStoreBase=GRADLE_USER_HOME
    zipStorePath=wrapper/dists
  7. Gradle-Plugin auf 8.0.0 aktualisieren:

    # gradle.properties
    android.useAndroidX=true
    - android.enableJetifier=true
  8. Gradle-Wrapper auf 8.0.2 aktualisieren build.gradle:

    # AndroidManifest.xml
    <?xml version="1.0" encoding="utf-8"?>
    - <manifest xmlns:android="http://schemas.android.com/apk/res/android"
    -     package="[YOUR_PACKAGE_ID]">
    + <manifest xmlns:android="http://schemas.android.com/apk/res/android">
    # build.gradle
    android {
    +     namespace "[YOUR_PACKAGE_ID]"
          compileSdkVersion rootProject.ext.compileSdkVersion
  9. Update androidScheme: In Capacitor 6, https wird die Standard-Einstellung für androidScheme für bestehende Apps, um Capacitor-Anwendungen besser die Möglichkeit zu geben, das System-Fill-Funktion zu nutzen. Um Datenverlust zu vermeiden, der durch diese Änderung entsteht, setzen Sie die Scheme auf http jetzt, auch wenn es die aktuelle Standard-Einstellung ist.

    {
      server: {
        androidScheme: "http"
      }
    }
  10. Update Kotlin version: Wenn Ihr Projekt Kotlin verwendet, aktualisieren Sie die kotlin_version Variable auf '1.8.20'.

Änderungen in der Plugin-Funktionalität

Die folgende Plugin-Funktionalität wurde geändert oder entfernt. Aktualisieren Sie Ihre code entsprechend:

  • Action Sheet
  • Browser
  • Kamera
  • Gerät
  • Standort
  • Google Maps
  • Lokale Benachrichtigungen
  • Push-Benachrichtigungen
  • Statusleiste

Aktionsschaltfläche

  • Aktualisiere das androidxMaterialVersion __CAPGO_KEEP_0__ 1.8.0.

Browser

  • Aktualisiere das androidxBrowserVersion Variablen auf 1.5.0.

Kamera

  • Für Android 13, fügen Sie die Berechtigung zum Lesen von Medienbildern (<uses-permission android:name="android.permission.READ_MEDIA_IMAGES"/>) in AndroidManifest.xml.
  • Aktualisieren Sie die androidxMaterialVersion Variablen auf 1.8.0.
  • Aktualisieren Sie die androidxExifInterfaceVersion Variablen auf 1.3.6.

Gerät

  • Ändern Sie DeviceId.uuid auf DeviceId.identifier.
  • Bei iOS 16+, DeviceInfo.name wird eine allgemeine Gerätenamen zurückgeben, es sei denn, Sie fügen die entsprechenden Zugriffsrechte.

Standortbestimmung

  • Aktualisieren Sie playServicesLocationVersion zu 21.0.1.

Google Maps

  • Aktualisieren Sie die folgenden Variablen:
    • googleMapsPlayServicesVersion zu 18.1.0.
    • googleMapsUtilsVersion zu 3.4.0.
    • googleMapsKtxVersion zu 3.4.0.
    • googleMapsUtilsKtxVersion zu 3.4.0.
    • kotlinxCoroutinesVersion zu 1.6.4.
    • androidxCoreKTXVersion zu 1.10.0.
    • kotlin_version zu 1.8.20.

Lokale Benachrichtigungen

  • Für Android 13 ist eine neue Laufzeitberechtigungsprüfung erforderlich, um lokale Benachrichtigungen zu planen, wenn sich der Zielbereich auf SDK 33. Aufruf befindet. Ruf checkPermissions() und requestPermissions() entsprechend.

Push-Benachrichtigungen

  • Für Android 13 ist eine neue Laufzeitberechtigungsprüfung erforderlich, um Push-Benachrichtigungen zu empfangen, wenn sich der Zielbereich auf SDK 33. Aufruf befindet. Ruf checkPermissions() und requestPermissions() entsprechend.
  • Aktualisiere das firebaseMessagingVersion Feld auf 23.1.2.

Status Bar

  • Auf iOS wurde die Standard-Status-Leiste-Animation geändert in FADE.

Indem Sie diese Schritte befolgen und Ihr code entsprechend aktualisieren, sollten Sie nun erfolgreich Ihr Projekt von Capacitor 4 auf Capacitor 5 aktualisiert haben. Stellen Sie sicher, dass Sie Ihre Anwendung gründlich testen, um sicherzustellen, dass alle Funktionen und Plugins wie erwartet funktionieren.

Live-Updates für Capacitor-Apps

Wenn ein Fehler im Web-Schicht lebt, liefern 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-Verfahren bleiben.

Jetzt loslegen

Neueste von unserem Blog

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