Bereitstellung einer virtuellen DOM-App von Oracle JET vorbereiten

Einführung

In diesem Tutorial erfahren Sie, wie Sie eine virtuelle DOM-App von Oracle JavaScript Extension Toolkit (Oracle JET) für das Deployment vorbereiten.

Sie können die virtuelle Oracle JET-DOM-App bereitstellen, die eine Sammlung von HTML-, TypeScript-Dateien mit JSX-Syntax-(TSX-) und Cascading Style Sheets-(CSS-)Dateien für jeden Web- oder Anwendungsservertyp enthält. Die Deployment-Methode hängt vom Typ der Serverumgebung ab, in der Ihre App ausgeführt wird.

Um die virtuelle Oracle JET-DOM-App bereitzustellen, können Sie dieselbe Methode verwenden, mit der Sie jede andere Clientschnittstelle in Ihrer spezifischen Umgebung bereitstellen.

Die virtuelle DOM-App, die Sie mit dem Befehl aus dem Oracle JET-Befehlszeilenschnittstellenpackage (npx @oracle/ojet-cli create JET-Virtual-DOM-app --template=basic --vdom) erstellen, enthält ein Verzeichnis mit Hook-Skript-Vorlagendateien, mit denen Sie neue Schritte für den Build-Prozess definieren können. Beispiel: Sie können ein Hook-Skript erstellen, um das virtuelle DOM-Anwendungsverzeichnis /web als ZIP-Datei oder als WAR-Datei zu archivieren. Dieses after_build-Skript wird ausgeführt, nachdem der Build-Prozess abgeschlossen ist.

Dieses Tutorial veranschaulicht nicht die Deployment-Schritte, die von einer bestimmten Umgebung und Plattform abhängen.

Ziele

In diesem Tutorial erfahren Sie, wie Sie das Verzeichnis /web der virtuellen DOM-App entweder als ZIP-Datei oder als WAR-Datei archivieren. Außerdem erfahren Sie, wie Sie die virtuelle DOM-App ändern, um die Archivierung im Rahmen des Oracle JET-Anwendungserstellungsprozesses zu automatisieren.

Voraussetzungen

Aufgabe 1: after_build-Hookskript erstellen

Sie erstellen das Hook-Skript after_build mit einer bereitgestellten Hook-Skript-Vorlagendatei, die Sie ändern.

  1. Navigieren Sie zum Verzeichnis JET-Virtual-DOM-app/scripts/hooks, und öffnen Sie die Hook-Skriptvorlagendatei after_build.js in einem Editor.

  2. Kopieren Sie das Code-Snippet after-build-js.txt, und ersetzen Sie den Inhalt der Vorlagendatei durch das kopierte Code-Snippet.

Aufgabe 2: after_build-Hookskript ändern

Ändern Sie das Hook-Skript, um den Typ der Archivdatei anzugeben, die Sie für die virtuelle DOM-App generieren möchten. Das Hook-Skript verwendet dieselbe Komprimierungsmethode, um die ZIP-Datei und die WAR-Datei zu erstellen. Sie ändern das Hook-Skript after_build, um die Erweiterung der Ausgabedatei anzugeben, die standardmäßig .war ist.

  1. Bearbeiten Sie in der Datei after_build.js den an fs.createWriteStream() übergebenen Dateinamen, um die entsprechende Erweiterung zu verwenden: .zip oder .war.
    • Um eine WAR-Datei zu generieren, benennen Sie die Datei my-archive.war. 
      const output = fs.createWriteStream('my-archive.war');
    • Um eine ZIP-Datei zu generieren, benennen Sie die Datei my-archive.zip. 
      const output = fs.createWriteStream('my-archive.zip');
  2. Speichern Sie die Datei after_build.js, ohne den Dateinamen zu ändern. Die Dateinamen der Hook-Skripte im Verzeichnis /scripts/hooks entsprechen verschiedenen Oracle JET-Build-Hook-Punkten.

Aufgabe 3: App im Release-Modus erstellen

Wenn Sie die virtuelle DOM-App im Releasemodus erstellen, ersetzt der Befehl build --release die Entwicklungsversion der Bibliotheken und Skripte im Verzeichnis /web/ durch verkleinerte Versionen. Wenn der Build-Prozess abgeschlossen ist, führt der Build das Hook-Skript after_build aus und archiviert den Inhalt des Verzeichnisses /web.

  1. Öffnen Sie ein Terminalfenster, wechseln Sie in das Verzeichnis JET-Virtual-DOM-app, und installieren Sie das npm-Package archiver.

    npm install archiver

    Dadurch wird das npm-Package archiver im Projekt JET-Virtual-DOM-app installiert. Der after_build.js-Hook verwendet dieses Package zum Archivieren Ihrer virtuellen DOM-App.

  2. Öffnen Sie ein Terminalfenster, wechseln Sie in das Verzeichnis JET-Virtual-DOM-app, und erstellen Sie die virtuelle DOM-App im Releasemodus.

    npx ojet build web --release

    Der Build-Prozess löst Hook-Skripte aus, die sich im Verzeichnis /scripts/hooks befinden, und dauert einige Minuten.

  3. Auf Bestätigung warten

    . . .
Running after_build hook.
Success: Build finished.
Files were successfully archived.

  4. Navigieren Sie zum Verzeichnis JET-Virtual-DOM-app, und suchen Sie die vom Hook-Skript generierte Archivdatei. Beispiel: Wenn Sie das after_build-Hookskript geändert haben, um eine WAR-Datei namens my-archive.war zu generieren, wird im Anwendungs-Root-Verzeichnis eine WAR-Datei mit diesem Namen angezeigt.

    WAR-Datei im Root-Verzeichnis einer virtuellen Oracle JET-DOM-App

Nächsten Schritt

In diesem Tutorial wird das Modul Ihre erste Oracle JET Virtual DOM-App in diesem Lernpfad zum Erstellen virtueller DOM-Webanwendungen abgeschlossen.

Sie können mit dem nächsten Tutorial im Lernpfad Übergeordneten Container 1 und Aktivitätscontainerkomponenten erstellen im Modul Komponenten zusammenstellen fortfahren.

Sie können auch zur Hauptseite des virtuellen DOM-Lernpfads zurückkehren, um auf alle Module zum Erstellen virtueller DOM-Apps zuzugreifen.

Weitere Lernressourcen

Sehen Sie sich weitere Übungen zu docs.oracle.com/learn an, oder greifen Sie auf weitere kostenlose Lerninhalte im Oracle Learning YouTube-Kanal zu. Besuchen Sie außerdem education.oracle.com/learning-explorer, um ein Oracle Learning Explorer zu werden.

Die Produktdokumentation finden Sie im Oracle Help Center.