Saltare al contenuto principale
Capacitor

Updating from Capacitor 4 to Capacitor 5: A Step-by-Step Guide

Learn how to update your project from Capacitor 4 to Capacitor 5 with minimal breaking changes, including updating official plugins and required tools.

Martin Donadieu

Autore

Valeria

Recensore

Jordan

Curatore

Aggiornamento da Capacitor 4 a Capacitor 5: Una Guida Passo dopo Passo

Updating from Capacitor 4 to Capacitor 5: A Step-by-Step Guide

Confronto con le precedenti aggiornamenti, la transizione da Capacitor 4 a Capacitor 5 comporta cambiamenti minimi di rottura. Questa guida fornisce istruzioni passo dopo passo per aggiornare il tuo progetto a Capacitor 5, nonché una lista dei cambiamenti di rottura per i plugin ufficiali.

Nota: Capacitor 5 richiede NodeJS 16 o superiore, poiché Node 12 è giunto alla fine della vita e Node 14 raggiungerà la fine della vita il 30 aprile 2023. Si consiglia di utilizzare la versione LTS più recente di NodeJS.

  1. Installare la latest versione del Capacitor CLI nel tuo progetto:

    npm i -D @capacitor/cli@latest
  2. Eseguire il seguente comando per far gestire la migrazione al CLI:

    npx cap migrate

    Se alcune fasi di migrazione non possono essere eseguite, ulteriori informazioni saranno fornite nell'output del terminale. I passaggi di migrazione manuali sono elencati di seguito.

  3. Se hai installato l'estensione VS Code, controlla la sezione raccomandazioni dell'estensione per trovare l'opzione di migrare il tuo progetto a Capacitor 5.

Aggiornamento del progetto Capacitor 4 iOS a Capacitor 5

  1. Aggiornare Xcode: Capacitor 5 richiede Xcode 14.1+.

  2. Aggiornare .gitignore: Effettua le seguenti modifiche al tuo .gitignore : File:

    - App/Podfile.lock
    + App/output
  3. : Aggiorna gli asset per utilizzare un'icona di app unica: Xcode 14 supporta un'icona di app unica di 1024x1024. Pulisci il tuo AppIcon.appiconset eliminando tutte le dimensioni non necessarie.

Aggiornamento del progetto Android da Capacitor 4 a Capacitor 5

  1. Aggiorna Android Studio: Capacitor 5 richiede Android Studio Flamingo | 2022.2.1 o versione successiva a causa dell'utilizzo di Gradle 8, che richiede Java JDK 17. Java 17 è incluso in Android Studio Flamingo, quindi non sono necessarie scariche aggiuntive.

  2. Esegui l'assistente di aggiornamento di AGP: Android Studio può aiutarti con alcune aggiornamenti relativi a Gradle e il movimento di pacchetti nei file di build. Per iniziare, esegui Tools -> AGP Upgrade Assistant.

  3. Aggiorna le variabili del progetto Android: Nel tuo variables.gradle : File, aggiorna i tuoi valori ai seguenti minimi nuovi:

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

    # build.gradle
    dependencies {
    -       classpath 'com.google.gms:google-services:4.3.13'
    +       classpath 'com.google.gms:google-services:4.3.15'
    }
  5. Aggiorna plugin Gradle a 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. Aggiorna wrapper Gradle a 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. Disabilita Jetifier:

    # gradle.properties
    android.useAndroidX=true
    - android.enableJetifier=true
  8. Sposta il pacchetto a 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. Aggiorna androidScheme: In Capacitor 6, https sarà la impostazione predefinita per androidScheme per le app esistenti per consentire meglio agli applicazioni Capacitor di utilizzare il sistema del feature di completamento automatico. Per evitare la perdita di dati a causa di questo cambiamento, impostare lo schema a http ora, anche se è l'impostazione predefinita corrente.

    {
      server: {
        androidScheme: "http"
      }
    }
  10. Aggiorna la versione di Kotlin: Se il tuo progetto utilizza Kotlin, aggiorna il kotlin_version variabile a '1.8.20'.

Modifiche e rimozioni della funzionalità dei plugin

I seguenti plugin hanno subito modifiche o rimozioni. Aggiorna il tuo code di conseguenza:

  • Schermo di azione
  • Navigatore
  • Camera
  • Dispositivo
  • Geolocalizzazione
  • Mappa di Google
  • Notifiche locali
  • Notifiche push
  • Barra dello stato

Finestra di azione

  • Aggiorna il androidxMaterialVersion variabile a 1.8.0.

Browser

  • Aggiorna il androidxBrowserVersion variabile a 1.5.0.

Camera

  • Per Android 13, aggiungi la permessione di lettura delle immagini dei media (<uses-permission android:name="android.permission.READ_MEDIA_IMAGES"/>in AndroidManifest.xml.
  • Aggiorna il androidxMaterialVersion variabile a 1.8.0.
  • Aggiorna il androidxExifInterfaceVersion variabile a 1.3.6.

Dispositivo

autorizzazioni

  • Geolocalizzazione playServicesLocationVersion Aggiorna il 21.0.1.

a

  • contexto: Pagina di prodotto per aggiornamenti in tempo reale. Ruolo: Etichetta UI breve o elemento di navigazione. Chiave di messaggio `live_update_dynamic_label_to` (Etichetta dinamica di aggiornamento in tempo reale To).
    • googleMapsPlayServicesVersion per 18.1.0.
    • googleMapsUtilsVersion per 3.4.0.
    • googleMapsKtxVersion per 3.4.0.
    • googleMapsUtilsKtxVersion per 3.4.0.
    • kotlinxCoroutinesVersion per 1.6.4.
    • androidxCoreKTXVersion per 1.10.0.
    • kotlin_version Notifiche locali 1.8.20.

Per Android 13, è richiesta una nuova verifica di autorizzazione runtime per pianificare notifiche locali quando si mira a __CAPGO_KEEP_0__ 33. Chiamare

  • For Android 13, a new runtime permission check is required to schedule local notifications when targeting SDK 33. Call checkPermissions() di conseguenza. requestPermissions() Notifiche Push

perché

  • For Android 13, è richiesta una nuova verifica di autorizzazione runtime per ricevere notifiche push quando si mira a SDK 33. Chiamata checkPermissions() e requestPermissions() di conseguenza.
  • Aggiorna il firebaseMessagingVersion variabile a 23.1.2.

Barra dello Stato

  • Sul iOS, l'animazione predefinita della barra dello stato è stata modificata in FADE.

Seguendo questi passaggi e aggiornando il tuo code di conseguenza, dovresti ora aver aggiornato con successo il tuo progetto da Capacitor 4 a Capacitor 5. Assicurati di testare la tua applicazione attentamente per assicurarti che tutte le funzionalità e i plugin funzionino come previsto.

Continua da Aggiornamento da Capacitor 4 a Capacitor 5: Una Guida Passo dopo Passo

Se stai utilizzando Aggiornamento da Capacitor 4 a Capacitor 5: Una Guida Passo dopo Passo per pianificare il lavoro dei plugin nativi, connettilo con Capgo Directory dei Plugin per il flusso di lavoro del prodotto in Capgo Directory dei Plugin, Capacitor Plugin da Capgo per la dettaglio di implementazione in Capacitor Plugin da Capgo, Aggiungere o Aggiornare i Plugin per la dettaglio di implementazione in Aggiungere o Aggiornare i Plugin, Sostituti dei Plugin Enterprise Ionic per il flusso di lavoro del prodotto in Sostituti dei Plugin Enterprise Ionic, e Capgo Costruzioni Native per il flusso di lavoro del prodotto in Capgo Costruzioni Native.

Aggiornamenti in tempo reale per le app Capacitor

Quando un bug del layer web è attivo, invia la correzione attraverso Capgo invece di aspettare giorni per l'approvazione della store. Gli utenti ricevono l'aggiornamento in background mentre le modifiche native rimangono nel normale percorso di revisione.

Sostegno umano da Martin

Inizia subito

Ultimi articoli dal nostro Blog

Capgo vi offre le migliori informazioni che hai bisogno per creare un'app mobile davvero professionale.