您现在的位置是:首页 >技术杂谈 >谷歌前端GWT项目整合springboot并打成jar包进行部署网站首页技术杂谈
谷歌前端GWT项目整合springboot并打成jar包进行部署
简介谷歌前端GWT项目整合springboot并打成jar包进行部署
一:背景
我们的一个配置中心项目使用了GWT + springboot的项目架构。之前的部署方式是将GWT先用maven编译成js文件,然后把js文件再单独部署到tomcat中尽情启动,相当于一个前后端分离的状态。但是随着我们逐渐将应用部署方式转向云的时候,单独部署tomcat+再部署一个后端jar项目就不如直接部署一个自带前端项目的jar项目更香了。(方便开发,测试,及部署。大大提高工作效率!)
二:实现思路
将GWT编译后产生的前端文件直接放到springboot的static文件夹下。这样启动boot后直接可以访问到前端。
实现在项目中使用maven命令就可以完成编译,打包。无需其他手动操作。
三:实现方式
主要通过修改pom文件中插件的方式来实现
1. 修改原model的war包改为jar包
<modelVersion>4.0.0</modelVersion>
<artifactId>asdasd</artifactId>
<packaging>jar</packaging>
2. 解决jsp报错问题
<!-- 必须使用低版本tomcat,否则jsp报错.怀疑是jsp写法问题,未调研
https://blog.csdn.net/chenzhirong520/article/details/125167400 -->
<dependency>
<groupId>org.apache.tomcat.embed</groupId>
<artifactId>tomcat-embed-jasper</artifactId>
<version>7.0.109</version>
<scope>provided</scope>
</dependency>
<!-- 借据7版本tomcat:juli 报错 -->
<dependency>
<groupId>org.apache.tomcat</groupId>
<artifactId>tomcat-juli</artifactId>
<version>7.0.109</version>
<scope>compile</scope>
</dependency>
<!-- jsp报错:Unable to compile class for JSP https://blog.csdn.net/chen888312/article/details/78639236 -->
<dependency>
<groupId>javax.servlet</groupId>
<artifactId>servlet-api</artifactId>
<scope>provided</scope>
</dependency>
<dependency>
<groupId>javax.servlet</groupId>
<artifactId>jstl</artifactId>
<version>1.2</version>
</dependency>
3. 修改gwt编译插件:将默认编译后的输出路径放到这个目录下<webappDirectory>./src/main/webapp/</webappDirectory>
是为了方便在本地通过boot方式启动,本地启动前需要先编译
<plugin>
<groupId>org.codehaus.mojo</groupId>
<artifactId>gwt-maven-plugin</artifactId>
<executions>
<execution>
<goals>
<goal>compile</goal>
</goals>
<!-- gwt 配置官网 https://gwt-maven-plugin.github.io/gwt-maven-plugin/compile-mojo.html -->
<configuration>
<module>com.qwe.1123.app.Module</module>
<!--<extraJvmArgs>-Xmx4096M</extraJvmArgs>-->
<extraJvmArgs>-Xmx1024M</extraJvmArgs>
<enableAssertions>true</enableAssertions>
<draftCompile>false</draftCompile>
<!-- 为了强制重新编译, -->
<force>true</force>
<!-- 下面一行配置对于包含了drools的依赖的app项目非常重要,否则会因为drools对ecj的依赖导致编译失败,以后考虑加到management里去 -->
<!-- 在eclipse里运行里,需要修改run configuration -> classpath ,把gwt-dev.jar放到项目之前 -->
<gwtSdkFirstInClasspath>true</gwtSdkFirstInClasspath>
<!--为了信鸽扫描增加的内容,上面
内存有4095改成了1024 -->
<localWorkers>2</localWorkers>
<!-- persistentunitcachedir配置成系统编译路径是因为。修改了webappDirectory后,输出地址发生了改变 -->
<persistentunitcachedir>${project.build.directory}</persistentunitcachedir>
<!-- 放到这个目录下是为了方便在本地通过boot方式启动,本地启动前需要先编译 -->
<webappDirectory>./src/main/webapp/</webappDirectory>
<deploy>${project.build.directory}/${project.build.finalName}</deploy>
</configuration>
</execution>
</executions>
<dependencies>
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-core</artifactId>
<version>${spring.version}</version>
</dependency>
<dependency>
<groupId>com.google.gwt</groupId>
<artifactId>gwt-dev</artifactId>
<version>${gwt.version}</version>
</dependency>
</dependencies>
</plugin>
4. 使用antrun命令,将gwt编译后的代码复制到target路径,目的是为了将前端页面编译到jar包中
<!-- 使用antrun命令,将gwt编译后的代码复制到target路径,目的是为了将前端页面编译到jar包中.
antrun使用方法 https://blog.csdn.net/qq_33547169/article/details/83059858-->
<plugin>
<groupId>org.apache.maven.plugins</groupId>
<artifactId>maven-antrun-plugin</artifactId>
<executions>
<execution>
<id>prepare</id>
<!-- 在package之前进行copy -->
<phase>prepare-package</phase>
<configuration>
<tasks>
<echo message="将gwt编译后的页面拷贝到target路径"/>
<copy todir="${project.build.directory}/classes/META-INF/resources/" overwrite="true">
<fileset dir="./src/main/webapp/"/>
</copy>
</tasks>
</configuration>
<goals>
<goal>run</goal>
</goals>
</execution>
</executions>
</plugin>
小tips:加快GWT项目编译速度的配置
设置为仅支持chrome浏览器,减少排列组合,加快编译速度
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE module PUBLIC "-//Google Inc.//DTD Google Web Toolkit 2.4.0//EN" "http://google-web-toolkit.googlecode.com/svn/tags/2.4.0/distro-source/core/src/gwt-module.dtd">
<module rename-to="App">
<inherits name='com.123.Module' />
<!-- 所有的外部js文件引入请放在jquery之后 -->
<script src="js/pcsLigerDialog.js" />
<!-- 设置为仅支持chrome浏览器,减少排列组合,加快编译速度 -->
<set-property name="user.agent" value="safari" />
<!-- 设置为仅支持中文,加快编译速度 @link https://blog.csdn.net/ttfuckyou3/article/details/84127696?ops_request_misc=&request_id=&biz_id=102&utm_term=gwt%20%20%E7%BC%96%E8%AF%91%E5%8A%A0%E9%80%9F&utm_medium=distribute.pc_search_result.none-task-blog-2~all~sobaiduweb~default-0-84127696.142^v73^insert_down4,201^v4^add_ask,239^v1^insert_chatgpt&spm=1018.2226.3001.4187 -->
<extend-property name="locale" values="zh_CN"/>
<entry-point class='com.param.ui.client.product.ModuleLoad' />
<public path="public"/>
<source path='client'/>
</module>
风语者!平时喜欢研究各种技术,目前在从事后端开发工作,热爱生活、热爱工作。