HTML5-Entwicklung von Java mit TeaVM

Was ist TeaVM?

** TeaVM ist ein Transpiler, der von Java nach JavaScript / HTML konvertiert. ** ** ** Mit TeaVM können Sie HTML5 in Java entwickeln.

Ein ähnliches Tool ist Googles GWT (Google Web Toolkit), während GWT von der Quelle (.java) in JavaScript konvertiert. TeaVM konvertiert ByteCode (.class oder .jar) in JavaScript. Daher kann TeaVM aus anderen JVM-Sprachen als Java verwendet werden. (Es gibt Beispielprojekte von Kotlin und Scala auf der offiziellen Seite)

Es hat auch bessere Eigenschaften wie Reflexion als GWT.

Offizielle Seite

TeaVM URL http://teavm.org/ TeavVM-Quelle https://github.com/konsoletyper/teavm

Um TeaVM nutzen zu können, benötigen Sie JDK und Maven. Laden Sie es daher herunter / installieren Sie es. JDK-Download Download Maven Nicht erforderlich, wenn bereits installiert.

• JDK kann bei 8 stabil sein

Ein Projekt erstellen

Weitere Informationen finden Sie auf der Seite Erste Schritte auf der offiziellen Website.

** * TeaVM-Anfängern wird nicht empfohlen, die neueste Quelle von Github zu löschen und zu verwenden ** ** Es ist nicht stabil, kann nicht kompiliert werden und der Test läuft ständig ** ** Zunächst empfehlen wir, mit Maven ein TeaVM-Projekt zu erstellen **

Führen Sie den folgenden Befehl in der Befehlszeile wie folgt aus, um ein TeaVM-Projekt mit Maven zu erstellen:

> mvn -DarchetypeCatalog=local -DarchetypeGroupId=org.teavm -DarchetypeArtifactId=teavm-maven-webapp -DarchetypeVersion=0.6.1 archetype:generate

Für Maven angeben - Die Version von DarchetypeVersion ist Verwenden Sie für die neueste Version die nummerierte Version im roten Feld des offiziellen Getting Started-Images Es ist möglicherweise nicht stabil, wenn es zu alt oder zu neu ist.

Wenn Sie den Befehl ausführen, werden Sie nach den folgenden Elementen gefragt. Geben Sie sie daher ein. Ich denke, groupID kann eine Gruppen-ID oder ein Paketname sein Artefakt-ID gibt den Projektnamen an. Version bleibt gleich Für das Paket wird das Paket mit der Gruppen-ID verwendet. Lassen Sie es also unverändert Geben Sie schließlich "Y" ein, um das Projekt zu erstellen

Nach einer Weile wird im aktuellen Verzeichnis ein Ordner mit dem durch Artefakt-ID angegebenen Namen erstellt und das Projekt darin erstellt.

Erstellen Sie das Projekt

Wechseln Sie in den Ordner, in dem das Projekt erstellt wurde (Name angegeben durch Artefakt-ID).

>mvn clean package

Dann wird der erste Build durchgeführt. ** Zunächst wird das erforderliche Repository heruntergeladen, daher dauert es einige Zeit. ** ** ** Ich denke, es wird weniger als eine Minute dauern, um ab dem zweiten Mal zu bauen

Der zweite und nachfolgende Build

>mvn package

Es ist in Ordnung.

Ausführung von generiertem JavaScript / HTML

Die erstellte Datei ist Ziel / (künstliche ID) - (Version) Es wird im Ordner erstellt.

Wenn Sie keine Version und kein Paket angeben Ziel / (Künstler-ID) -1.0-SNAPSHOT Ich denke, es wird im Ordner generiert

Wenn Sie index.html mit einem Browser in den Ordner laden und die folgende Anzeige angezeigt wird, ist die Erstellung erfolgreich.

TeaVM generated element

Wenn Sie die Datei nicht lesen, können Sie die HTML-Datei einfach direkt in den Browser laden. Wenn Sie jedoch Dateien lesen oder XMLHttpRequest verwenden möchten, müssen Sie einen Server lokal einrichten. (Weil es CORS wird)

Ausführungsdatei und erforderliche Dateien

Die einzigen Dateien, die zum Ausführen benötigt werden, sind: Keine Notwendigkeit für src etc.

index.html teavm/classes.js teavm / runtime.js (möglicherweise nicht verfügbar)

Wenn Sie Debug-Informationen benötigen, benötigen Sie die folgenden Dateien:

teavm/classes.js.map teavm/classes.js.teavmdbg

Bearbeiten

Wenn Sie ein Projekt erstellen src / main / java / paketname /Client.java Datei wurde erstellt. Bearbeiten Sie diese Datei, um mit der tatsächlichen Quelle zu spielen.

Hellow World !! Fügen Sie einfachen Code hinzu. Der Text "Hallo Welt !!" wird auf der Konsole angezeigt. Wie das Bild am Ende der Hauptmethode

System.out.prinln("Hellow World !!");

Fügen Sie die Zeile hinzu.

> mvn package

Erstellen Sie das Paket erneut und laden Sie index.html erneut in den Browser. Dann sollte die JavaScript-Konsole "Hellow World !!"

Die JavaScript-Konsole hängt vom Browser ab. In Firefox Menü → Extras → Webentwicklung → Webkonsole (oder STRG + UMSCHALT + K oder STRG + UMSCHALT + I) Klicken Sie für Chrome auf Menü → Andere Tools → Entwicklertools → Registerkarte Konsole (oder STRG + UMSCHALT + I).