如何在页面刷新时重新加载CSS? gwt Maven

时间:2019-02-19 01:44:42

标签: maven gwt

这是我正在从事的项目:https://github.com/veracityidinc/idf-sandbox

我是前端开发人员,所以对我来说这还不清楚。 我查看了构建日志,以尝试在咨询谷歌之后确定数字,并且我看到人们在谈论插件和复制文件。对我来说,Web项目-无论是哪种类型-都开箱即用,这似乎很奇怪。每当我进行更改时,必须关闭并运行服务器非常繁琐。同样非常奇怪的是,应用程序的html部分实际上是自己完成的。

2 个答案:

答案 0 :(得分:2)

GWT仅处理JS(以及通过特殊代码结构直接由代码加载的资产),而不处理其他Web资产。

DevMode(带有Mojo插件的mvn gwt:run)将为您的Web应用服务,并且Mojo的插件还将在启动时复制src/main/webapp。如果要更新Web资源而不重启DevMode,请运行mvn war:exploded -Dgwt.compiler.skip。同样,对于资源(在src/main/resources中):运行mvn process-resources

这也是采用不同项目布局,将客户端和服务器代码分离到不同的Maven模块中,并且也分别运行客户端和服务器代码的一个好理由(对于客户端代码,mvn gwt:codeserver通过{{1} },net.ltgt.gwt.maven:gwt-maven-plugin或类似的服务器代码和网络资产)

答案 1 :(得分:1)

使用GWT SDM-超级开发模式-您将立即使用它,SDM将在后台继续运行并监视文件是否被修改,刷新后将逐步重新编译您的应用并重新加载资源。

如果您正在使用Maven来使SDM工作,则需要创建一个GWT项目并应用maven插件,推荐的插件是tbroyer plugin并创建一个已经开箱即用地正确配置的GWT项目您可以使用杂物箱多模块gwt-maven-archetype

按照您发出命令时原型的说明进行操作 mvn gwt:codeserver -pl *-client -am实际上是在启动SDM。另一个命令正在启动您的应用程序服务器。

生成的项目具有一个xxx服务器模块,您可以在其中找到一个CSS文件。一旦运行了这两个命令并且可以在浏览器中加载应用程序,请尝试更改该文件中的某些样式并刷新页面,更改应反映出来。

这是从原型生成项目时的示例插件配置

<plugin>
    <groupId>net.ltgt.gwt.maven</groupId>
    <artifactId>gwt-maven-plugin</artifactId>
    <configuration>
        <moduleName>[replace this with your module]</moduleName>
        <moduleShortName>app</moduleShortName>
    </configuration>
</plugin>

现在,如果您不使用这种多模块结构,则可以尝试使用mvn gwt:devmode启动应用程序和SDM,这应该为您启动SDM

如果您使用的是uibinder,并且在重新编译SDM时正在* .ui.xml文件中编辑样式,那么它也应该选择更改。

修改

在检查您的项目时,我进行了一些更改以使其正常工作。

首先我更改了pom.xml,您可以在以后的项目中使用我的版本,但我认为更好的方法是使用tbroyer原型生成项目

绒球

<?xml version="1.0" encoding="UTF-8"?>
<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/maven-v4_0_0.xsd">

    <modelVersion>4.0.0</modelVersion>
    <groupId>com.candorgrc.idfusion</groupId>
    <artifactId>idf-sandbox</artifactId>
    <packaging>war</packaging>
    <version>0.0.1-SNAPSHOT</version>
    <name>IdFusion™ Sandbox</name>
    <properties>

        <!-- Setting maven.compiler.source to something different to 1.8 needs
            that you configure the sourceLevel in gwt-maven-plugin since GWT compiler
            2.8 requires 1.8 (see gwt-maven-plugin block below) -->
        <maven.compiler.source>1.8</maven.compiler.source>
        <maven.compiler.target>1.8</maven.compiler.target>

        <project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
        <project.reporting.outputEncoding>UTF-8</project.reporting.outputEncoding>
        <inject.gin.version>2.1.2</inject.gin.version>
        <inject.guice.version>3.0</inject.guice.version>
        <libsass.version>0.2.10-libsass_3.5.3</libsass.version>
        <lesscss.version>1.7.0.1.1</lesscss.version>
        <elemental2.version>1.0.0-RC1</elemental2.version>

    </properties>

    <dependencyManagement>
        <dependencies>
            <dependency>
                <groupId>com.google.gwt</groupId>
                <artifactId>gwt</artifactId>
                <version>2.8.2</version>
                <type>pom</type>
                <scope>import</scope>
            </dependency>
        </dependencies>
    </dependencyManagement>

    <dependencies>
        <dependency>
            <groupId>com.google.gwt</groupId>
            <artifactId>gwt-servlet</artifactId>
            <scope>runtime</scope>
        </dependency>
        <dependency>
            <groupId>com.google.gwt</groupId>
            <artifactId>gwt-user</artifactId>
            <scope>provided</scope>
        </dependency>
        <dependency>
            <groupId>com.google.gwt</groupId>
            <artifactId>gwt-dev</artifactId>
            <scope>provided</scope>
        </dependency>
        <dependency>
            <groupId>com.google.elemental2</groupId>
            <artifactId>elemental2-dom</artifactId>
            <version>${elemental2.version}</version>
        </dependency>
        <dependency>
            <groupId>com.google.gwt.inject</groupId>
            <artifactId>gin</artifactId>
            <version>${inject.gin.version}</version>
        </dependency>
        <dependency>
            <groupId>com.google.inject</groupId>
            <artifactId>guice</artifactId>
            <version>${inject.guice.version}</version>
        </dependency>

    </dependencies>

    <build>
        <!-- Output classes directly into the webapp, so that IDEs and "mvn process-classes"
            update them in DevMode -->
        <outputDirectory>${project.build.directory}/${project.build.finalName}/WEB-INF/classes</outputDirectory>

        <plugins>

            <!-- GWT Maven Plugin -->
            <plugin>
                <groupId>net.ltgt.gwt.maven</groupId>
                <artifactId>gwt-maven-plugin</artifactId>
                <version>1.0-rc-8</version>
                <executions>
                    <execution>
                        <goals>
                            <goal>compile</goal>
                        </goals>
                    </execution>
                </executions>
                <configuration>
                    <moduleName>com.candorgrc.idfusion.sandbox.IdfSandbox</moduleName>
                    <moduleShortName>IdfSandbox</moduleShortName>
                    <failOnError>true</failOnError>
                    <!-- GWT compiler 2.8 requires 1.8, hence define sourceLevel here if
                        you use a different source language for java compilation -->
                    <sourceLevel>1.8</sourceLevel>

                    <warDir>${project.build.directory}/${project.build.finalName}</warDir>
                    <classpathScope>compile+runtime</classpathScope>
                    <!-- URL(s) that should be opened by DevMode (gwt:devmode). -->
                    <startupUrls>
                        <startupUrl>sandbox.html</startupUrl>
                    </startupUrls>
                </configuration>
            </plugin>
            <plugin>
                <groupId>org.lesscss</groupId>
                <artifactId>lesscss-maven-plugin</artifactId>
                <version>${lesscss.version}</version>
                <configuration>
                    <sourceDirectory>${project.basedir}/src/main/webapp/less</sourceDirectory>
                    <outputDirectory>${project.basedir}/src/main/webapp/less</outputDirectory>
                    <compress>true</compress>
                </configuration>
                <executions>
                    <execution>
                        <goals>
                            <goal>compile</goal>
                        </goals>
                    </execution>
                </executions>
            </plugin>


        </plugins>
    </build>
</project>

您还需要在与客户端软件包相同的级别上创建一个新软件包,并将其命名为public,这是gwt使用的默认公共资源。这应该放在src文件夹com.candorgrc.idfusion.sandbox.public中,然后将css文件sandbox.css移到该程序包中。

一旦进行了这些更改,只要您的IDE知道css已更改,并且应该将其移动到目标文件夹中的正确位置,刷新页面时就可以重新加载css。