Migrieren von App Center zu Capgo

Migration Summary

• Capgo ist ein Dienst, der Entwicklerteams dabei hilft, lebendige Apps an deployte Apps zu senden.
• Capacitor JS-Anwendungen, die in jQuery Mobile, Framework 7, Sencha, KendoUI, Ionic oder sogar Ihre eigene Custom-Lösung geschrieben wurden, können migriert werden. Ein bestehendes Ionic-App ist nicht erforderlich..
• Colt bietet äquivalente Dienste für App Center Build (Erstellen von Android/iOS-Anwendungen). Für Test-, Diagnose- und Analyse-Dienste.

Hinweis

Wenn Ihre App noch Cordova verwendet, ist es notwendig, vor der Migration zu Capacitor zuerst zu Capgo zu migrieren.

Mit Capacitor ermöglicht die Ionic-Team, die Entwicklung nahe an die nativen Werkzeuge und -funktionen heranzuführen, mit dem Ziel, einen noch besseren Benutzererlebnis und Leistung zu bieten.

Glücklicherweise ist der Migrationsprozess einfach und die meisten Cordova-Plugins sind backwards kompatibel mit Capacitor. Hier beginnt die Migration.

Über Capgo

Capgo übernimmt die Aktualisierung von Apps im Laufe der Zeit. Entwicklungsteams können sich voll und ganz auf die einzigartigen Funktionen ihrer App konzentrieren und den komplexen App-Delivery-Prozess an Capgo outsourcen.

Capgo füllt die Lücken zwischen Web-Delivery und Mobil.

Capgo-Voraussetzungen

Wie App Center Capgo Unterstützt GitHub Apps, die in Git-Repositories auf Azure DevOps, Bitbucket, GitHub, und GitLab gehostet werden.

Capgo CLI installieren

Hinweis

Stellen Sie sicher, dass Sie Node und NPM auf Ihrem Computer installiert haben, bevor Sie fortfahren. Verwenden Sie immer die aktuelle LTS-Version Capgo ältere Versionen nicht.

Erstellen package.json und Capacitor Konfigurationsdateien

Hinweis

Bevor Sie beginnen, empfehle ich Ihnen, Änderungen auf einer frischen Git-Branche vorzunehmen.

Da Capgo für die Automatisierung von capacitor-Anwendungen erstellt wurde, benötigt es eine Datei, die Ihre Anwendung möglicherweise nicht hat. Zuerst müssen Sie eine capacitor.config.json Datei erstellen. Der einfachste Weg, sie zu erstellen, besteht darin, in der Wurzel Ihrer Anwendung zu laufen:

npm install @capacitor/core

Dann initialisieren Sie Capacitor mithilfe des CLI-Fragebogens:

npx cap init

Der CLI wird Ihnen einige Fragen stellen, beginnend mit dem Namen Ihrer Anwendung und der Paket-ID, die Sie für Ihre Anwendung verwenden möchten.

Fügen Sie die neuen Dateien schließlich Ihrem Projekt hinzu:

git add .git commit -m "added package json and capacitor config" && git push

Migrieren Sie die Code

Da Sie nun die erforderlichen neuen Dateien haben, können Sie sich auf die eigentliche App selbst konzentrieren. Capgo Wenn Ihr gebauter __CAPGO_KEEP_0__ nicht in einem Verzeichnis liegt, ändern Sie diesen Wert im __CAPGO_KEEP_0__-Konfigurationsdatei. Capgo Anwendungskonfiguration dist.

If your built code is not in a dist Wenn Ihr gebauter Capacitor nicht in einem Verzeichnis liegt, ändern Sie diesen Wert im Capacitor-Konfigurationsdatei.

App-Struktur

Konfiguration von Capgo

Mit Ihrer App bereit für Capgo die Integration, ist es Zeit sich anzumelden und Ihre API-Schlüssel zu erhalten, um Ihre erste Version hochzuladen! Beginnen Sie damit sich für ein Capgo-Konto anzumelden.

Einmal angemeldet bei Capgo, navigieren Sie zur Konten-Seite und klicken Sie auf API-Schlüssel, dann klicken Sie auf die ‘Schreiben’-Schlüssel, um ihn in Ihre Zwischenablage zu kopieren.

Installieren Sie das Capgo-SDK

Aus einer Befehlszeile direkt in das Verzeichnis Ihrer Capacitor-App, führen Sie den folgenden Befehl aus:

npm i @capgo/capacitor-updater && npx cap sync Um das Plugin in Ihre Capacitor-App zu installieren.

Und fügen Sie dann Ihrer App diesen code als Ersatz für CodePush hinzu:

import { CapacitorUpdater } from '@capgo/capacitor-updater'

CapacitorUpdater.notifyAppReady()

Das wird dem native Plugin mitteilen, dass die Installation erfolgreich war.

Live-Updates bereitstellen (CodePush Alternative)

Die Live-Update-Funktion funktioniert, indem sie die installierte __CAPGO_KEEP_0__ verwendet. Capgo SDK in Ihrer native Anwendung, um auf einen bestimmten Deploy-Kanal-Ziel zu hören. Wenn eine Web-Ausgabe einem Kanal-Ziel zugewiesen wird, wird diese Aktualisierung auf Geräten mit laufenden Binärdateien bereitgestellt, die auf das angegebene Kanal-Ziel eingestellt sind.

Anmelden bei Capgo CLOUD

Zunächst verwenden Sie den all apikey die in Ihrem Konto vorhanden ist, um sich mit dem CLI anzumelden:

npx @capgo/cli@latest login YOURKEY

Fügen Sie Ihre erste App

Lassen Sie uns loslegen, indem wir zunächst die App in Capgo Cloud mit der CLI erstellen.

npx @capgo/cli@latest app add

Diese Anweisung wird alle Variablen verwenden, die in der Capacitor Konfigurationsdatei definiert sind, um die App zu erstellen.

Hochladen Ihrer ersten Bundle

Führen Sie den Befehl aus, um Ihre code zu erstellen und senden Sie sie an Capgo mit:

npx @capgo/cli@latest bundle upload --channel production

Standardmäßig wird der Versionsnamen der in Ihrem Konto vorhanden sein. package.json Datei.

Überprüfen Sie Capgo ob die Build vorhanden ist.

Sie können es sogar mit meiner mobil-Sandbox-App testen.

Standardkanal festlegen

Nachdem Sie Ihre App an Capgo gesendet haben, müssen Sie Ihren Kanal default um Apps zu ermöglichen, Updates von Capgo zu erhalten.

npx @capgo/cli@latest channel set production -s default

Konfigurieren Sie die App zum Validieren von Updates

Fügen Sie diese Konfiguration in Ihr Haupt-JavaScript-File ein.

import { CapacitorUpdater } from '@capgo/capacitor-updater'

CapacitorUpdater.notifyAppReady()

Dann führen Sie dann ein npm run build && npx cap copy Ihre App aktualisieren.

Live-Update auf einem Gerät erhalten

Damit Ihre Anwendung ein Live-Update von Deploy empfängt, müssen Sie die App auf einem Gerät oder einem Emulator ausführen. Der einfachste Weg, dies zu tun, besteht darin, die folgende Kommandozeilenanweisung auszuführen, um Ihre lokale App in einem Emulator oder einem mit Ihrem Computer verbundenen Gerät zu starten.

npx cap run [ios | android]

Öffnen Sie die App, stellen Sie sie in den Hintergrund und öffnen Sie sie erneut. Sie sollten im Protokoll sehen, dass die App das Update durchgeführt hat.

Herzlichen Glückwunsch! 🎉 Sie haben erfolgreich Ihr erstes Live-Update veröffentlicht. Dies ist nur der Anfang dessen, was Sie mit Live-Updates erreichen können. Um mehr zu erfahren, besuchen Sie die vollständigen Live-Updates-Dokumentation.

App Center-Abhängigkeiten entfernen

Da wir nun die Dienste von Capgo integriert haben, sollten Sie alle Verweise auf App Center entfernen. Es ist eine gute Praxis, unnötige code/Dienste zu entfernen, und die Entfernung von SDK sollte die Größe Ihrer Apps reduzieren.

Zuerst öffnen Sie ein Terminal und deinstallieren Sie die App Center-Plugins:

    cordova plugin remove cordova-plugin-appcenter-analytics cordova-plugin-appcenter-crashes cordova-plugin-code-push

Als nächstes öffnen Sie config.xml und entfernen Sie die folgenden preference Werte. Sie sollten ähnlich aussehen wie: __CAPGO_KEEP_2__

    <preference name="APP_SECRET" value="0000-0000-0000-0000-000000000000" /><preference name="CodePushDeploymentKey" value="YOUR-ANDROID-DEPLOYMENT-KEY" /><preference name="CodePushPublicKey" value="YOUR-PUBLIC-KEY" />

If Sie App Center Analytics in Ihrer App verwendet haben, entfernen Sie die folgenden preferences elements: APPCENTER_ANALYTICS_ENABLE_IN_JS und APPCENTER_CRASHES_ALWAYS_SEND.

Entfernen Sie die folgenden <access /> elements:

    <access origin="https://codepush.appcenter.ms" /><access origin="https://codepush.blob.core.windows.net" /><access origin="https://codepushupdates.azureedge.net" />

Entfernen Sie die Referenz auf CodePush in der CSP meta Tag in der index.html Datei (https://codepush.appcenter.ms):

    <meta http-equiv="Content-Security-Policy" content="default-src https://codepush.appcenter.ms 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *" />

Schließlich entfernen Sie innerhalb Ihrer App alle code-Verweise auf App Center-Dienste, wie z.B. codePush.sync();.

Zukünftige Schritte

Sie haben sich von App Center auf Capgo migriert und nutzen die Live-Updates. Dies ist nur der Anfang dessen, was Sie mit Capgo tun können. Entdecken Sie den Rest der Dienste, einschließlich Kanal (Mehrere Umgebungen) und Überschreiben. Cloud CLI-Integration, verwenden Sie Capgo innerhalb Ihres CI/CD-Plattformen Ihrer Wahl (z.B. GitHub-Action, GitLab, Jenkins und mehr).

Automatische Senden von App-Update

Wenn Ihr code auf GitHub gehostet ist, können Sie die automatische Build- und Release-Konfiguration in wenigen Schritten einrichten, dank GitHub-Aktionen.

Ich habe einen zweiten Artikel erstellt, um Ihnen dies zu ermöglichen.

Kredite

Vielen Dank an Ionic, dieser Artikel basiert auf dieser Artikel wieder mit chat-gpt-3 und angepasst.

Weiterhin von Migrating from App Center zu Capgo

Wenn Sie __CAPGO_KEEP_0__ verwenden Migrating from App Center zu Capgo um die Migration und die Unternehmensoperationen zu planen und zu verbinden Capgo Enterprise für den Produktworkflow in Capgo Enterprise, Ionic Enterprise Plugin Alternativen für den Produktworkflow in Ionic Enterprise Plugin Alternativen, Capgo Alternativen für den Produktworkflow in Capgo Alternativen, Capgo Consulting für den Produktworkflow in Capgo Consulting, und Capgo Premium Support für den Produktworkflow in Capgo Premium Support.