Using GWT with IntelliJ IDEA Community Edition

For a recent game project I wanted to try out GWT. I was already making it cross-platform — with both a desktop and an android target — so it made sense to try and run it in the browser as well.

As a recent convert to IntelliJ IDEA, I’m perfectly satisfied with the free Community Edition. Doing mostly Android work, my usage does not justify getting a license just yet. So I was slightly bummed that GWT support is only available in the Ultimate Edition.

The IDEA Help page lists in some detail what this “GWT support” entails. A lot of useful stuff no doubt, most of which I don’t really need. I want the GWT classes to show up in the IDE and autocomplete when asked. This shouldn’t be hard to achieve in CE now should it?

Indeed it’s not hard at all and here how I did it.

GWT Maven template

From the GWT Command Line Tools reference:

Since nowadays Maven is widely used and importing maven projects in IDE is easier, it’s better that you select it for your new GWT projects.

Despite this declaration, the maven template is not (yet?) the default for a fresh GWT project. When invoking webAppCreator, by default we get a build.xml for Ant.

What we need to do is to choose Maven template explicitly with the -templates switch, like so:

webAppCreator -templates maven,sample -out gwtsample pl.czak.gwtsample.SampleApp

This generates a folder structure according to the Maven standard layout and a pom.xml preconfigured for the project.

Note: As of GWT 2.7.0, the generated pom.xml is broken. This is a known issue and to fix we only need to add the <type> parameter in the <dependencyManagement> block:

pom.xml
<dependencyManagement>
  <dependencies>
    <!-- ensure all GWT deps use the same version (unless overridden) -->
    <dependency>
      <groupId>com.google.gwt</groupId>
      <artifactId>gwt</artifactId>
      <version>${gwtVersion}</version>
      <scope>import</scope>
      <type>pom</type> <!-- ADD THIS LINE -->
    </dependency>
  </dependencies>
</dependencyManagement>

Import into IDEA

With the pom.xml in hand, we can import it easily into IDEA. Import project and select pom.xml. An import wizard will guide you through the process. Most of the defaults are fine. You might want to check Automatically download: Sources and/or Documentation if you want inline documentation and navigating into the GWT sources:

Automatic import

Usage

To interact with the build process, use the Maven projects tool window (View → Tool windows → Maven projects). Run war:exploded first to create the WAR structure for the GWT’s development server. Now you can run gwt:run to start the GWT Dev Mode.

From here on it’s no different than working with GWT in a standalone way. You get the DevMode window and you can see the log in the IDE’s Run tool window.

For convenience, save gwt:run as a Run/Debug configuration:

gwt:run Run configuration

This way you start Dev Mode by pressing Ctrl-R.

If you haven’t downloaded the sources or documentation for the dependencies, you can do so now from the Maven projects tool window:

Download Sources

To build a production version, use the gwt:clean and gwt:compile goals.

Downsides

One obvious downside is that the IDE will not warn you if you’re using JRE methods unsupported by GWT. From the point of view of the Java compiler, a call to String.format is perfectly fine:

String.format in the IDE

However, this method is not supported by GWT and this will only be made apparent during the GWT compilation stage. You will need to look up the issue in the log by yourself:

[INFO] GET /recompile/sampleapp
[INFO]    Job pl.czak.gwtsample.SampleApp_1_1
[INFO]       starting job: pl.czak.gwtsample.SampleApp_1_1
[INFO]       binding: user.agent=safari
[INFO]       Compiling module pl.czak.gwtsample.SampleApp
[INFO]          Ignored 1 unit with compilation errors in first pass.
[INFO] Compile with -strict or with -logLevel set to TRACE or DEBUG to see all errors.
[INFO]          Finding entry point classes
[INFO]             Tracing compile failure path for type 'pl.czak.gwtsample.client.SampleApp'
[INFO]                [ERROR] Errors in 'file:/Users/czak/Projects/gwtsample/src/main/java/pl/czak/gwtsample/client/SampleApp.java'
[INFO]                   [ERROR] Line 39: The method format(String, String) is undefined for the type String
[INFO]             [ERROR] Hint: Check the inheritance chain from your module; it may not be inheriting a required module or a module may not be adding its source path entries properly
[INFO]       [ERROR] Compiler returned false
[INFO]       [WARN] recompile failed
[INFO]       [WARN] continuing to serve previous version

I assume that IDEA Ultimate’s “official” GWT support helps with that although I can’t verify that. For my purposes this downside is very minor. In my latest project I only needed to replace two occurrences unsupported by GWT:

  • Replaced the missing String.format with string concatenation
    • literally in one place so no big deal at all
  • Replaced the missing ArrayDeque with LinkedList
    • again fine, even more so since I was using it as a Queue and a Deque and didn’t need ArrayDeque specifically

Alternatives

The default webAppCreator template uses Ant and this kind of project can also be imported into IDEA, albeit with a little more effort. You will need to add the GWT libraries manually to your project dependencies (actually just adding gwt-user.jar is enough to cover all code in the sample project). You may also want to import build.xml as the projects’s build file:

Add build.xml as Ant Build File

And again, for convenience, you can turn the devmode task into a Run configuration:

Add devmode task as Run configuration

If you’re starting from scratch however, I strongly recommend going with the Maven template.

If you’re invested in Gradle already, there is the gradle-gwt-plugin. According to its GitHub page it has not been updated recently, but I have used it successfully in a project. It made sense since I already had a Gradle multi-project setup in place and the GWT module was just another subproject I wanted to add. However — as with anything — YMMV.

Łukasz Adamczak's Picture

About Łukasz Adamczak

I'm a mobile & web developer based in Warsaw, Poland. On this blog I write down notes from my programming journeys.

Warsaw, Poland http://czak.pl

Comments