GWT Super Development Mode mit externem Application Server in IntelliJ Idea (JWT und Tomcat)

Owned by Benjamin Albanese
Last updated: März 08, 2021
Erstellt auf Basis von JWT 5.10.0.10

Diese Anleitung beschreibt Schritt für Schritt, wie IntelliJ Idea konfiguriert wird, um den GWT Development Mode in Kombination mit einem Tomcat zu verwenden. Ziel ist es dabei, den standardmäßig im Development Mode verwendeten Jetty Servletcontainer durch Tomcat zu ersetzen.

Dies ist eine Erweiterung der Artikels GWT Super Development Mode mit externem Application Server in Eclipse (JWT und Tomcat), angepasst an die im März 2021 eingesetzten Versionen. Der in GWT enthaltene Embedded-Jetty-Snapshot der Version 9.2.14.v20151106 verhindert faktisch ein Debuggen mit Java 11. Leider wurde mit GWT 2.9.0 diese Jetty Version nicht aktualisiert, so dass der beschrieben Workaround erforderlich ist, um unter Java 11 debuggen zu können.

Die im verlinkten Artikel getroffenen Aussagen sind nach wie vor gültig. Wer mit Eclipse arbeiten möchte, kann den dortigen Leitfaden nach wie vor verwenden - egal ob mit einem JDK in Version 8 oder 11.

Gleichzeitig entwickeln aber in der Zwischenzeit viele Entwicklerinnen und Entwickler mit IntelliJ Idea, wo sich die Vorgehensweise doch erheblich unterscheidet. Für diese Personengruppe soll dieser Artikel dienen. 

Im Gegensatz zum ursprünglichen Artikel orientiert sich dieser Artikel am gwt tutorial, konkret am Abschnitt: 5 - Custom Command (Dokument von URL laden). Der zum Zeitpunkt des Artikels verwendete Commit ist die a372c9b88137fb539cc61f394de8b16113256148 vom 29.01.2021.

Im Folgenden werden die wichtigsten Punkte daraus isoliert, sowohl textuell als auch mit Bildern.

Step-by-step Guide

  1. Tomcat einrichten

    1. Tomcat herunterladen und in ein Wunschverzeichnis entpacken:
      • Link: Tomcat v9
      • In der Navigationsleiste auf der linken Seite kann man auch andere (eventuell neuere) Versionen wählen.

  2. Tomcat in IntelliJ konfigurieren

    1. Neue Run-Konfiguration erstellen, welche die Anwendung auf dem Tomcat laufen lässt
    2. Neuen Tomcat hinzufügen
    3. In diesem Beispiel wurde bereits zuvor ein Tomcat 9.043 hinzugefügt, wir fügen im Moment die Version 9.0.41 hinzu, auf dem der Rest dieses Tutorials basiert. 
    4. Nun wird ein Name vergeben und der richtige Tomcat ausgewählt, aber noch ist kein Deployment vorhanden, das mit diesem Tomcat gestartet werden könnte, daher auch der Warnhinweis unten rechts im Bild.
    5. Deployment hinzufügen
    6. Tutorial 005 auswählen
    7. Deployment wurde hinzugefügt.
    8. Durch das Hinzufügen des Deployments hat sich nun auch die URL geändert.
    9. Nun starten Sie bitte die Debug Konfiguration - wie unten rechts zu sehen, benötigt dies initial einige Zeit, bis die Kompilierung erfolgt ist.
  3. Development Mode konfigurieren:
    1. Nun können Sie bereits den Server-Code debuggen. Allerdings benötigt das Hochfahren des Tomcat jedes Mal sehr lange und Änderungen am Code erfordern einen kompletten Neustart. Beispielsweise könnten Sie folgende Codezeilen im JadiceWidget (ca. Codezeile 75) ändern, um die Reihenfolge der Buttons zu ändern. Das wird sich aber erst dann bemerkbar machen, wenn der Tomcat neu gestartet wird:
    2. Daher erstellen wir nun auch eine GWT Codeserver Konfiguration.
    3. Dazu geben wir der Konfiguration einen Namen und wählen das Module "jwt-tutorial-005" aus
    4. Als Nächstes müssen wir die Dev-Mode Parameter setzen. Hierfür müssen wir zuerst den Pfad ausfindig machen, aus dem Tomcat seine Dateien bezieht. Dieser Pfad, der von IntelliJ als derjenige gekennzeichnet ist, in dem die "exploded war" liegt, liegt unterhalb des target-Verzeichnisses und heißt hier "jwt-tutorial-005-5.10.0.10". 
    5. Wir benötigen den absoluten Pfad
    6. Diesen Pfad nutzen wir wie folgt, um die DevMode Parameter zu setzen (bitte passen Sie Ihren Pfad entsprechend an):


  4. Demo im Browser laden:
    • Stellen Sie sicher, dass die Tomcat Konfiguration immer noch läuft. Falls nicht, starten Sie bitte diese Konfiguration.
    • Starten Sie nun auch die GWT Konfiguration.
    • Öffnen Sie im Browser die oben unter "start page" angegebene URL
    • Wenn Sie nun die oben erwähnten Änderungen im JadiceWidget (oder anderen clientseitigen Klassen) vornehmen, sollte ein Refresh des Browsers ausreichen, um die UI neu zu gestalten, ohne dass Sie einen der beiden laufenden Server neu starten müssen.