Getting started with the SuperDevMode

Question

I just want to run a simple app using superDevMode to know its benefits. The CodeServer is getting started successfully, but it is complaining there is no gwt modules to compile in the UI. I followed the following steps.

1. I started with GWT Default code which will be generated when we create the new project. I then converted it to Maven project.

2. I then modified my gwt.xml file to add the linker. Here is the copy my gwt.xml

   <module rename-to='superdevmode'>
   <inherits name='com.google.gwt.user.User' />
   <inherits name='com.google.gwt.user.theme.clean.Clean' />
   <entry-point class='superDevMode.client.SuperDevMode' />
   <add-linker name="xsiframe" />
   <set-configuration-property name="devModeRedirectEnabled"
   value="true" />
   </module>
   

3. I added the codeserver jar and set the proper classpath.

Codeserver is getting started successfully.

   The code server is ready.
   Next, visit: http://localhost:9876/

When I launch the UI am getting the following

But when I click on Dev Mode On, am getting the following

I don't know what I am doing wrong. My POM entry looks like this.

              <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
<modelVersion>4.0.0</modelVersion>
<groupId>superDevMode</groupId>
<artifactId>superDevMode</artifactId>
<version>0.0.1-SNAPSHOT</version>
             </project>

Correct me if i am wrong.

Answer 1

Update: v2.6 looks like it will have a better example launcher for superdevmode (see under superdevmode at http://www.gwtproject.org/release-notes.html#Release_Notes_2_6_0_RC1 ) 2.6 will be released any day now. I am using RC3 and it seems fine. More here:

---

While I appreciate the detail on how SuperDevMode works in Thomas' article, what is really needed is a step-by-step guide with some trouble shooting.

Here is a step-by-step. There are so many places to go wrong and the SuperDev mode page is not very specific. Hopefully this makes it clear:

1. Configure your module .gwt.xml file with the additional lines (you should place this at the bottom of you module definition, ie just before </module>):

<add-linker name="xsiframe"/>
<set-configuration-property name="devModeRedirectEnabled" value="true"/>
<!-- enable source maps -->
<set-property name="compiler.useSourceMaps" value="true" />

2. Run the standard GWT compile process - in Eclipse this is "GWT Compile Project..." - this is what you typically do when you are deploying GWT code. No doubt you have a maven or ant command that does this as well.

3. Start a regular webserver that you'd normally use when developing your GWT code. For example, the one you used normal DevMode with. I'll call this one localhost:8888 - I'm going to presume the page you'd normally launch is index.html, so http://localhost:8888/index.html shows your GWT app. (you probably have ?gwt.codesvr=127.0.0.1:9997 in that URL normally)

4. Start the SuperDevMode server (see the bottom of this answer for two methods). You now have two webservers running - on different ports. So, lets say SuperDevMode is running on localhost:1234. At the bottom of this answer I posted some ways to start SuperDevMode.

5. Point your browser to the SuperDevMode server, so http://localhost:1234 . Follow the instructions to and copy the two shortcuts to your addressbar

6. Now, point your browser to the regular webserver, http://localhost:8888/index.html - do not add ?gwt.codesvr=127.0.0.1:9997 to the URL - that is only for NotSuper DevMode. (ie regular DevMode)

7. Click on the shortcut link "DevMode On" that you copied in Step 5. It should ask you to choose a module to compile, click the Compile button.

8. If you want sourcemaps (see your java source code in the Chrome script browser) you must turn it on in Chrome. In my version of Chrome (Ubuntu) there is a little gear on the bottom right of the Chrome console (Inspect Element, then look on the bottom right of the browser window). Click that and find "Enable Source Maps". Reload the page and it should now show you the Source codes.

---

Two ways to launch super dev mode:

From the command line

java -classpath $GWT_HOME/gwt-codeserver.jar:$GWT_HOME/gwt-dev.jar:$GWT_HOME/gwt-user.jar:app:./lib/*  com.google.gwt.dev.codeserver.CodeServer \
  -bindAddress 0.0.0.0 -port 1234 -src src -workDir work com.foo.MyModule

From an Eclipse Laucher

In Eclipse, create a new Java Application Launcher (not a Web Application launcher!) with the following configuration:

Main Class:

com.google.gwt.dev.codeserver.CodeServer

Program Arguments:

-src src -workDir ${workspace_loc:MyProject}/codeserver -port 1234 com.foo.MyModule

-workDir is optional

VM arguments ( These may be needed depending on the size of your project. If the superdevmode "Compile" button (in the browser) disappears immediately after you click and nothing seems to happen, it may be crashing because of insufficient memory)

-Xmx1024m -Xms512m

Classpath: add gwt-codeserver.jar, gwt-dev.jar and gwt-user.jar to the launch classpath (these jars are found in the GWT SDK installation directory).