Vorschau einer lokalen Erweiterung des universellen Editors
Um eine Vorschau einer Erweiterung des universellen Editors während der Entwicklung anzuzeigen, müssen Sie Folgendes tun:
- Führen Sie die Erweiterung lokal aus.
- Akzeptieren Sie das selbstsignierte Zertifikat.
- Öffnen Sie eine Seite im universellen Editor.
- Aktualisieren Sie die Standort-URL, um die lokale Erweiterung zu laden.
Lokales Ausführen der Erweiterung
Dabei wird davon ausgegangen, dass Sie bereits eine Erweiterung des universellen Editors erstellt haben und sie beim lokalen Testen und Entwickeln in der Vorschau anzeigen möchten.
Starten Sie die Erweiterung des universellen Editors mit:
$ aio app run
Es werden Ausgaben wie die folgenden angezeigt:
To view your local application:
-> https://localhost:9080
To view your deployed application in the Experience Cloud shell:
-> https://experience.adobe.com/?devMode=true#/custom-apps/?localDevUrl=https://localhost:9080
Dadurch wird Ihre Erweiterung standardmäßig unter https://localhost:9080 ausgeführt.
Akzeptieren des selbstsignierten Zertifikats
Der universelle Editor erfordert HTTPS, um Erweiterungen zu laden. Da die lokale Entwicklung ein selbstsigniertes Zertifikat verwendet, muss Ihr Browser diesem explizit vertrauen.
Öffnen Sie eine neue Browser-Registerkarte und navigieren Sie zur URL der lokalen Erweiterung, die über den aio app run-Befehl ausgegeben wird:
https://localhost:9080
Ihr Browser zeigt eine Zertifikatwarnung an. Akzeptieren Sie das Zertifikat, um fortzufahren.
Nach der Annahme wird die Platzhalterseite der lokalen Erweiterung angezeigt:
Öffnen einer Seite im universellen Editor
Öffnen Sie den universellen Editor über die universelle Editor-Konsole oder indem Sie eine Seite in AEM Sites bearbeiten, die den universellen Editor verwendet:
Erweiterung laden
Suchen Sie im universellen Editor das Feld Speicherort oben in der Mitte der Benutzeroberfläche. Erweitern Sie sie und aktualisieren Sie die URL im Feld Speicherort, nicht die Browser-Adressleiste.
Fügen Sie die folgenden Abfrageparameter an:
devMode=true- Aktiviert den Entwicklungsmodus für den universellen Editor.ext=https://localhost:9080- Lädt die lokal ausgeführte Erweiterung.
Zum Beispiel:
https://author-pXXX-eXXX.adobeaemcloud.com/content/aem-ue-wknd/index.html?devMode=true&ext=https://localhost:9080
Vorschau der Erweiterung
Führen Sie einen harten Neustart des Browsers durch, um sicherzustellen, dass die aktualisierte URL verwendet wird.
Der universelle Editor lädt jetzt Ihre lokale Erweiterung - nur in Ihrer Browser-Sitzung.
Alle Code-Änderungen, die Sie lokal vornehmen, werden sofort übernommen.
