Entwickeln von Apps mit PhoneGap CLI developing-apps-with-phonegap-cli
Als Entwickler können Sie Ihre App jederzeit auf einem Gerät oder in einem Emulator ausführen, sofern Sie Ihre Entwicklungsumgebung konfiguriert haben.
Um die folgenden Beispiele auszuführen, benötigen Sie ein System, das macOS X mit Xcode ausführt, oder ein Mac/Win/Linux-System mit installiertem Android™ SDK.
Bootstrap Ihrer Entwicklungsumgebung bootstrap-your-development-environment
Einrichten der PhoneGap-CLI (https://docs.phonegap.com/en/4.0.0/guide_cli_index.md.html#The%20Command-Line%20Interface
)
Für iOS: Für die Entwicklung für iPhones und iPads benötigen Sie die Xcode-IDE von Apple.
- kostenlos herunterladen here.
- Handbuch zur PhoneGap iOS-Plattform (
https://docs.phonegap.com/en/4.0.0/guide_platforms_ios_index.md.html#iOS%20Platform%20Guide
)
Für Android™: Zur Entwicklung für iPhones und iPads benötigen Sie die Google Android™ Stuido IDE.
- kostenlos herunterladen here.
- Handbuch zur PhoneGap Android™-Plattform (
https://docs.phonegap.com/en/4.0.0/guide_platforms_android_index.md.html#Android%20Platform%20Guide
)
Quelle herunterladen download-the-source
Wenn Sie Ihre Entwicklungsumgebung erfolgreich per Bootstrapping gestartet haben, laden Sie die Quelle aus der AEM App-Build-Kachel herunter:
- Klicken Sie auf den Dropdown-Chevron für die PhoneGap Build-Kachel.
- Klicken Sie auf Quelle herunterladen .
- Wählen Sie die gewünschte Quelle aus dem Modal Quelle herunterladen aus.
- Klicken Sie auf Herunterladen und speichern Sie die ZIP-Datei auf Ihrem Computer.
- Extrahieren Sie die heruntergeladene ZIP-Datei in Ihren Arbeitsbereich.
Erstellen und Laden der App (aus der Quelle) build-and-load-the-app-from-source
Die PhoneGap-CLI kann ein Plattformprojekt erstellen, die Quelle kompilieren und die App in einem einzelnen Befehl bereitstellen.
https://phonegap.com/blog/2014/11/13/phonegap-cli-3-6-3/
).- Stellen Sie sicher, dass Sie PhoneGap CLI installiert haben (siehe oben).
- Navigieren Sie in einem Konsolenfenster (oder Terminalfenster) zum Stammverzeichnis der extrahierten Quelle.
- Geben Sie den folgenden Befehl ein:
phonegap run android
// -- or -- //
phonegap run ios
- Erstellen eines Ordners (mkdir-Test)
- Navigieren Sie in diesen neuen Ordner (cd test).
- Führen Sie
phonegap create helloWorld
aus. - Navigieren Sie zu helloWorld (cd helloWorld).
- Ausführen
phonegap run android
(oder ersetzen Sie Android™ durch iOS wie oben beschrieben). - Emulator öffnet die neu erstellte PhoneGap-App mit der Meldung "Device Ready", wenn die JavaScript Bridge zu nativ betriebsbereit ist.
Debuggen von JavaScript mit Safari- und IOS-Debugging debug-javascripts-with-safari-and-ios-debug
Sie können das JavaScript Ihrer App mit den Entwicklerwerkzeugen von Safari genauso debuggen wie mit einer Webanwendung.
Aktivieren der Safari-Entwicklertools enable-safari-developer-tools
So aktivieren Sie die Entwicklertools:
-
Öffnen Sie die Voreinstellungen von Safari
- Klicken Sie in der Menüleiste auf Safari
- Klicken Sie auf Voreinstellungen
-
Klicken Sie im Fenster "Voreinstellung"auf Erweitert .
- Aktivieren Sie "Menü "Entwickeln"in der Menüleiste anzeigen".
- Fenster "Voreinstellung"schließen
Safari mit iOS verbinden connect-safari-to-ios
Sie können Safari entweder mit einem iOS-Gerät oder -Emulator verbinden.
- Navigieren Sie in einem Konsolenfenster zum Stammverzeichnis der extrahierten Quelle.
- Geben Sie den folgenden Befehl ein, damit Sie Ihre App auf Ihrem Gerät oder Emulator starten können.
phonegap run <platform> --device
// -- or -- //
phonegap run <platform> --emulator
- Safari öffnen
- Klicken Sie in der Menüleiste auf Entwickeln .
- IOS Simulator-Untermenü auswählen
- Klicken Sie auf home.html
Debuggen von JavaScript mit dem Webinspektor von Safari debug-javascript-with-safari-s-web-inspector
Sie können Haltepunkte an einer beliebigen Stelle in Ihrer Quelle festlegen. Wenn Sie mit Ihrem Emulator oder Gerät interagieren, stoppt die Ausführung Ihrer App an diesen Haltepunkten. Sie können die Ausführung schrittweise durchführen und die Werte in Variablen überprüfen.
- Klicken Sie im Fenster des Web-Inspektors auf Ressourcen .
- Navigieren Sie in der Quellstruktur und klicken Sie auf die gewünschte Quelldatei.
- Klicken Sie auf die Zeilennummer neben, um einen Haltepunkt hinzuzufügen.
- Interagieren mit dem Gerät oder Emulator
- Verwenden Sie die Schaltflächen, um die Ausführung fortzusetzen, einen Schritt weiter zu gehen, Schritte in die Methoden einzuleiten und auszusteigen:
Die nächsten Schritte the-next-steps
Nachdem Sie sich mit der Entwicklung von Apps mit PhoneGap CLI vertraut gemacht haben, lesen Sie Zugreifen auf Gerätefunktionen.