Zum Hauptinhalt springen
Capacitor

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

Erhalten Sie Informationen, wie Sie Ihr Projekt von Capacitor 4 auf Capacitor 5 mit minimalen Änderungen aktualisieren können, einschließlich der Aktualisierung von offiziellen Plugins und erforderlichen Werkzeugen.

Martin Donadieu

Martin Donadieu

Inhaltsmarketer

Schritt-für-Schritt-Anleitung zur Aktualisierung von Capacitor 4 auf Capacitor 5

Im Vergleich zu vorherigen Updates beinhalten die Übergänge von Capacitor 4 auf Capacitor 5 nur minimale Änderungen. Diese Anleitung bietet eine Schritt-für-Schritt-Anleitung zur Aktualisierung Ihres Projekts auf Capacitor 5 sowie eine Liste der Änderungen 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 erreichen wird. Es wird empfohlen, die neueste LTS-Version von NodeJS zu verwenden.

  1. Installieren Sie die latest Version von der 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 Terminaloutput 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 zu migrieren.

Das Upgrade von Capacitor 4 auf iOS-Projekte auf Capacitor 5

  1. Xcode aktualisieren: Capacitor 5 erfordert Xcode 14.1+.

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

    - App/Podfile.lock
    + App/output
  3. Aktualisieren Sie Assets, um ein einzelnes App-Icon zu verwenden: Xcode 14 unterstützt ein einzelnes App-Icon von 1024x1024. Entfernen Sie alle überflüssigen Größen aus Ihrem AppIcon.appiconset.

Das Upgrade von Capacitor 4 auf Android-Projekte auf Capacitor 5

  1. Android Studio aktualisieren: Capacitor 5 erfordert Android Studio Flamingo | 2022.2.1 oder neuer aufgrund der Verwendung von Gradle 8, 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 dabei helfen, einige Updates in Bezug auf Gradle und das Verschieben von Paketen in Build-Dateien zu bearbeiten. Um zu beginnen, führen Sie Tools -> AGP Upgrade Assistant.

  3. Update Android-Projektvariablen: In Ihrem variables.gradle Datei, aktualisieren Sie Ihre Werte auf die folgenden neuen Mindestwerte:

    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. Update Google Services:

    # build.gradle
    dependencies {
    -       classpath 'com.google.gms:google-services:4.3.13'
    +       classpath 'com.google.gms:google-services:4.3.15'
    }
  5. Update Gradle-Plugin auf 8.0.0:

    # build.gradle
    dependencies {
    -       classpath 'com.android.tools.build:gradle:7.2.1'
    +       classpath 'com.android.tools.build:gradle:8.0.0'
    }
  6. Update Gradle-Wrapper auf 8.0.2:

    # 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. Deaktivieren Sie Jetifier:

    # gradle.properties
    android.useAndroidX=true
    - android.enableJetifier=true
  8. Verschieben Sie das Paket in 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 werden die Standard-Einstellungen sein. androidScheme For bestehende Apps, um Capacitor Anwendungen das System-Fill-Funktion zu ermöglichen. Um Datenverlust zu vermeiden, der durch diese Änderung entsteht, setzen Sie den Scheme auf http jetzt, selbst wenn es derzeit der Standard ist.

    {
      server: {
        androidScheme: "http"
      }
    }
  10. Kotlin-Version aktualisieren: Wenn Ihr Projekt Kotlin verwendet, aktualisieren Sie die kotlin_version Variablenanpassungen für Plugins '1.8.20'.

Die folgenden Plugin-Funktionen wurden geändert oder entfernt. Aktualisieren Sie Ihre __CAPGO_KEEP_0__ entsprechend:

The following plugin functionality has been modified or removed. Update your code accordingly:

  • Browser
  • Kamera
  • Gerät
  • Ortung
  • update the variable to
  • Google Maps
  • Lokale Benachrichtigungen
  • Push-Benachrichtigungen
  • Statusleiste

Aktionsschirm

  • Aktualisieren Sie das androidxMaterialVersion Variablenname auf 1.8.0.

Browser

  • Aktualisieren Sie das androidxBrowserVersion Variablenname auf 1.5.0.

Kamera

  • Für Android 13 fügen Sie die Leseberechtigung für Medienbilder hinzu (<uses-permission android:name="android.permission.READ_MEDIA_IMAGES"/>in der App AndroidManifest.xml.
  • Update das androidxMaterialVersion Variable auf 1.8.0.
  • Update das androidxExifInterfaceVersion Variable auf 1.3.6.

Gerät

  • Ändern DeviceId.uuid auf DeviceId.identifier.
  • Bei iOS 16+ DeviceInfo.name wird ein generischer Gerätename zurückgegeben, es sei denn, Sie fügen die entsprechenden Zugriffsrechte hinzu.

Standort

  • Aktualisieren Sie das 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.

zu Lokalen Benachrichtigungen

  • Für Android 13 ist ein neuer Laufzeitberechtigungsprüfung erforderlich, um lokale Benachrichtigungen zu planen, wenn SDK 33. Aufruf angegeben ist. checkPermissions() und requestPermissions() entsprechend.

Push-Nachrichten

  • Für Android 13 ist ein neuer Laufzeitberechtigungsprüfung erforderlich, um Push-Nachrichten zu erhalten, wenn SDK 33. Aufruf angegeben ist. checkPermissions() und requestPermissions() entsprechend.
  • Aktualisieren Sie firebaseMessagingVersion die 23.1.2.

Variable

  • Status-Leiste FADE.

Auf iOS wurde die Standard-Status-Leiste-Animation in code geändert. Wenn Sie diese Schritte befolgen und Ihre code entsprechend aktualisieren, sollten Sie jetzt erfolgreich Ihre 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.

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

Wenn Sie __CAPGO_KEEP_0__ verwenden Die Aktualisierung von Capacitor 4 zu Capacitor 5: Ein Schritt-für-Schritt-Leitfaden um native Plugin-Arbeit zu planen, verbinden Sie es mit Capgo Plugin-Verzeichnis zur Produktworkflow in Capgo Plugin-Verzeichnis, Capacitor Plugins von Capgo zur Implementierungsdetail in Capacitor Plugins von Capgo, Hinzufügen oder Aktualisieren von Plugins zur Implementierungsdetail in Hinzufügen oder Aktualisieren von Plugins, Ionic Enterprise Plugin Alternativen zum Produktworkflow in Ionic Enterprise Plugin Alternativen, und Capgo Native Builds für den Produktworkflow in Capgo Native Builds.

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-Zustimmung vorliegt. Die Benutzer erhalten die Aktualisierung im Hintergrund, während native Änderungen im normalen Review-Verfahren bleiben.

Los geht's

Aktuelles aus unserem Blog

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