如何为IntelliJ IDEA 2023新版本配置GWT Super Dev Mode

一、先调整Maven项目配置 #

打开项目的pom.xml，找到GWT Maven插件的配置块，确保参数符合以下要求——重点是开启Super Dev Mode，指定模块和端口：

<plugin>
  <groupId>org.codehaus.mojo</groupId>
  <artifactId>gwt-maven-plugin</artifactId>
  <version>2.9.0</version>
  <executions>
    <execution>
      <goals>
        <goal>compile</goal>
        <goal>test</goal>
        <goal>generateAsync</goal>
      </goals>
    </execution>
  </executions>
  <configuration>
    <!-- 替换成你自己的GWT模块全名，比如 com.yourcompany.yourapp -->
    <module>com.yourcompany.yourapp</module>
    <runTarget>index.html</runTarget> <!-- 你的应用入口HTML文件 -->
    <hostedWebapp>${project.build.directory}/${project.build.finalName}</hostedWebapp>
    <superDevMode>true</superDevMode> <!-- 强制开启Super Dev Mode -->
    <bindAddress>0.0.0.0</bindAddress>
    <port>8888</port> <!-- 应用运行端口 -->
    <codeServerPort>9876</codeServerPort> <!-- Code Server端口，别和其他服务冲突 -->
  </configuration>
</plugin>

配置完后，先执行一次Maven命令打包资源，避免后续启动报错：

mvn clean package -DskipTests

二、IntelliJ 运行配置设置 #

1. 配置GWT Code Server #

• 打开IntelliJ顶部的「Run」→「Edit Configurations」
• 点击左上角「+」，选择「Maven」，命名为GWT Code Server
• 在「Command line」输入：gwt:run-codeserver
• 切换到「Runner」标签，JRE选择JDK 1.8（必须和项目版本一致）
• 点击「Apply」保存

2. 配置本地Tomcat服务 #

因为你的应用依赖后端接口，得启动本地Tomcat：

• 再点击「+」，选择「Tomcat Server」→「Local」，命名为Dev Tomcat
• 切换到「Deployment」标签，点击「+」→「Artifact」，选择项目的war包（或者exploded war，推荐后者）
• 设置「Application context」为你的项目访问路径，比如/yourapp
• 切换到「Server」标签，Tomcat版本选和生产一致的，JRE同样选JDK 1.8
• 关键：在「Before launch」里，把默认的「Build」删掉，添加刚才的GWT Code Server配置——这样启动Tomcat前会先启动Code Server

三、启动和调试步骤 #

1. 先启动GWT Code Server，等控制台输出类似「The code server is ready at http://localhost:9876」的提示
2. 再启动Dev Tomcat，待Tomcat完全启动后，访问你的应用地址，比如http://localhost:8080/yourapp
3. 打开浏览器（推荐Chrome），访问http://localhost:9876，点击页面上的「Bookmark this link」添加「Dev Mode On」书签
4. 回到应用页面，点击书签栏的「Dev Mode On」，在弹出的窗口里选择你的GWT模块，确认后就开启了Super Dev Mode
5. 现在修改客户端Java代码，直接点击浏览器里的「Recompile」按钮，页面会自动刷新展示最新代码
6. 调试的话：给IntelliJ里的客户端Java代码打断点，然后给Chrome添加启动参数--remote-debugging-port=9222，重启Chrome后，在IntelliJ里添加「JavaScript Debug」配置，连接localhost:9222，触发代码逻辑就能命中断点

四、常见坑点排查 #

• Code Server启动失败：检查codeServerPort是否被占用，或者pom里的模块名是否写错（必须是完整的类路径）
• 改完代码Recompile没效果：清一下浏览器缓存，或者检查GWT模块的源路径配置是否正确（确保客户端代码在<source>标签指定的目录下）
• 断点不命中：确认用的是Super Dev Mode编译的代码（不是生产打包的war包代码），且Chrome的远程调试端口和IntelliJ配置一致

内容的提问来源于stack exchange，提问作者Raghuram Bhogireddy