gwt - SuperDevMode 入门

Question

我只想使用 superDevMode 运行一个简单的应用程序来了解它的好处。CodeServer 已成功启动，但它抱怨在 UI 中没有要编译的 gwt 模块。我按照以下步骤操作。

1. 我从创建新项目时生成的 GWT 默认代码开始。然后我将其转换为 Maven 项目。

2. 然后我修改了我的 gwt.xml 文件以添加链接器。这是我的 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. 我添加了 codeserver jar 并设置了正确的类路径。

Codeserver 正在成功启动。

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

当我启动 UI 时，得到以下信息

但是当我点击 Dev Mode On 时，我得到以下信息

我不知道我做错了什么。我的 POM 条目如下所示。

              <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>

如果我错了，请纠正我。

Answer 1

更新：v2.6 看起来它将有一个更好的 superdevmode 示例启动器（请参阅http://www.gwtproject.org/release-notes.html#Release_Notes_2_6_0_RC1的 superdevmode 下）2.6 将在任何一天发布。我正在使用 RC3，它似乎很好。更多在这里：

---

虽然我很欣赏Thomas 的文章中关于SuperDevMode 工作原理的详细信息，但真正需要的是包含一些故障排除的分步指南。

这是一步一步的。出错的地方太多了，SuperDev模式页面也不是很具体。希望这可以清楚地说明：

1. 使用附加行配置您的模块 .gwt.xml 文件（您应该将其放在模块定义的底部，即在之前</module>）：

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

2. 运行标准的 GWT 编译过程——在 Eclipse 中，这是“GWT Compile Project...”——这是您在部署 GWT 代码时通常会做的事情。毫无疑问，您也有执行此操作的 maven 或 ant 命令。

3. 启动您在开发 GWT 代码时通常使用的常规网络服务器。例如，您使用普通 DevMode 的那个。我将其称为 localhost:8888 - 我假设您通常启动的页面是 index.html，因此http://localhost:8888/index.html显示您的 GWT 应用程序。（您可能?gwt.codesvr=127.0.0.1:9997通常在该 URL 中）

4. 启动 SuperDevMode 服务器（有关两种方法，请参阅此答案的底部）。您现在有两个网络服务器正在运行 - 在不同的端口上。所以，假设 SuperDevMode 正在运行localhost:1234。在这个答案的底部，我发布了一些启动 SuperDevMode 的方法。

5. 将您的浏览器指向 SuperDevMode 服务器，因此http://localhost:1234. 按照说明将两个快捷方式复制到地址栏

6. 现在，将您的浏览器指向常规网络服务器，http://localhost:8888/index.html-不要添加?gwt.codesvr=127.0.0.1:9997到 URL - 这仅适用于 NotSuper DevMode。（即常规 DevMode）

7. 单击您在第 5 步中复制的快捷方式链接“DevMode On”。它应该要求您选择要编译的模块，单击“编译”按钮。

8. 如果你想要 sourcemaps（在 Chrome 脚本浏览器中查看你的 java 源代码），你必须在 Chrome 中打开它。在我的 Chrome 版本（Ubuntu）中，Chrome 控制台的右下角有一个小齿轮（检查元素，然后查看浏览器窗口的右下角）。单击它并找到“启用源映射”。重新加载页面，它现在应该向您显示源代码。

---

启动超级开发模式的两种方法：

从命令行

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

来自 Eclipse Laucher

在 Eclipse 中，使用以下配置创建一个新的Java 应用程序启动器（不是Web 应用程序启动器！）：

主类：

com.google.gwt.dev.codeserver.CodeServer

程序参数：

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

-workDir是可选的

VM 参数（根据项目的大小可能需要这些参数。如果超级开发模式的“编译”按钮（在浏览器中）在您单击后立即消失并且似乎没有任何反应，则可能是由于内存不足而崩溃）

-Xmx1024m -Xms512m

类路径：将 gwt-codeserver.jar、gwt-dev.jar 和 gwt-user.jar 添加到启动类路径（这些 jars 可以在 GWT SDK 安装目录中找到）。

Answer 2

我采取了稍微不同的方法。我从现有的Hello 项目开始，然后将其配置为在超级开发模式下工作。

A.为 hello 项目构建和部署 war 到 tomcat 中。

B.在 Hello 项目的 build.xml 中添加目标。

<target name="codeserver" depends="javac" description="Run Code Server mode">
    <java failonerror="true" fork="true" classname="com.google.gwt.dev.codeserver.CodeServer">
        <classpath>
            <pathelement location="src"/>
            <path refid="project.class.path"/>
            <pathelement location="../../gwt-codeserver.jar" />
            <pathelement location="../../validation-api-1.0.0.GA.jar" />
            <pathelement location="../../validation-api-1.0.0.GA-sources.jar" />
        </classpath>
        <jvmarg value="-Xmx1024M"/>
        <arg value="-bindAddress"/>
        <arg value="0.0.0.0"/>
        <arg line="-port"/>
        <arg value="9876"/>
        <arg value="-workDir"/>
        <arg value="workDir"/>
        <arg line="-src"/>
        <arg value="src"/>
        <arg value="com.google.gwt.sample.hello.Hello"/>
    </java>
</target>

C.ant codeserver使用命令提示符 运行代码服务器。

D.启动浏览器并导航以http://localhost:9876/ 创建书签

E.启动 Chrome 开发工具 (F12) 并启用 SourceMaps。

F.启动浏览器并导航到http://localhost:8080/Hello

G.在页面中点击“Dev Mode ON”书签http://localhost:8080/Hello

H.点击“编译”按钮，指示代码服务器将 gwt 源代码作为源映射加载到浏览器中。

I.万岁 java 文件被提取，可以在Chrome 开发控制台的源选项卡中看到。

J.找到 Hello.java 。点击行号设置调试点@ Window.alert("Hello, AJAX");。

K.点击 Hello World 中的“Click Me”。代码在 Chrome 中的 java 文件中的 Debug 点停止！！！！！！！！！欢呼。

截图参考 - http://geekbybit.blogspot.in/2013/03/diy-working-with-gwt-codeserver-tomcat.html

Answer 3

这里有一个很好的解释：http: //blog.ltgt.net/how-does-gwts-super-dev-mode-work/

您需要将小册子拖到浏览器中。然后像往常一样启动您的应用程序。在没有“?gwt.codesvr=127.0.0.1:9997”部分的浏览器中打开您的应用程序。现在您可以使用小册子启动 SuperDevMode。

希望这可以帮助。

Answer 4

使用多模块 maven gwt 项目，您需要在运行配置中添加源位置（基础项目和模块）：

-src src/main/java/ -src ${workspace_loc:MyNewModule}/src/main/java/ com.foo.MyModule