ha怎么样把maven打包_（window） maven项目下分模块vue前端和springboot项目打包为一个war包并部署在一台jboss机子上...

前面的文章有讲过前端和后端分开部署的文章

前端分离部署

后端分离部署

当前用的jboss版本是wildfly-18.0.1.Final

项目背景

maven管理springboot项目，创建了frontend和backend后端两个模块。前端是vue，后端是springboot，其他的模块是相关的业务功能模块

项目根目录处理pom

由于项目是maven管理，根目录以及各个子模块都有pom.xml，我们安装打包就在各个要打包的pom.xml写上相关插件信息即可。

首先根目录下的pom，需要把hr-fronted和hr-backend都写入。如果前后端分离其实可以不用写hr-fontend，因后端没有引用到。现在我们要前后端打成一个包就需要写在一起。

4.0.0

com.company

hr

1.86.6

pom

hr

hr project powered by booster

hr-backend

hr-frontend

xxx-auth

前端 hr-fronted的配置处理

pom.xml

下面的plugins作用是生成vue的dist包，npm install、npm clean 、npm run build通过执行语句来生成dist包。

xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">

4.0.0

com.company

hr

1.86.6

com.company

hr-frontend

1.0.0

jar

hr-frontend

hr-frontend powered by

org.codehaus.mojo

exec-maven-plugin

1.6.0

npm-install

exec

initialize

npm

install

--loglevel

verbose

npm-clean

exec

initialize

npm

run

clean

npm-run-build

exec

compile

npm

run

build

后端pom，打包为war包，并表明web的路径webResources

${project.artifactId}-${project.version}

org.springframework.boot

spring-boot-maven-plugin

${springboot.version}

com.foresealife.hr.Application

repackage

org.apache.maven.plugins

maven-war-plugin

3.0.0

${project.parent.basedir}/hr-frontend/dist

false

hr

org.apache.maven.plugins

maven-surefire-plugin

true

后端的 application.properties

加个上下文路径

server.servlet.context-path=/hr

前端配置一下vue.config.js

.....

module.exports = {

publicPath: process.env.NODE_ENV === 'production'

//baseUrl: process.env.NODE_ENV === 'production'

? './' // production base url.

: '/',

........

}

publicPath生产模式下为何使用./   而不是 /  ，是有原因，可以看打包后dist的index.html，加载的js css如果不写相对路径就会找不到内容

然后在项目总的根目录下(即第一张截图)执行 mvn clean install

就会在hr-backend的target下生成hr.war包，打开war的内容生成内容是这样的。

外面是vue打包的内容，后端的内容会打包再web-inf里面。

然后把这个war包放到jboss的 xxxx\wildfly-18.0.1.Final\standalone\deployments目录下，然后双击E:\installtion\server\wildfly-18.0.1.Final\bin\standalone.bat进行启动应用即可

可能有人疑问为什么要/hr/，这是因为打的war包是这个名字，启动项目后默认war名字为访问路径前缀。也因为这样，前端访问后端的接口都要加个/hr

注意自己的前端接口调用要写个hr，因为现在前后端访问都要/hr/， 如果接口已经写了很多，来不及加/hr ，一般我们也可以新建个HTTPRequest.js专门来管理接口请求，里面写axios相关的信息

...........

const conf = {

headers: {

'Content-Type': 'application/json; charset=utf-8'

},

timeout: 60000, // 超时时间

baseURL: process.env.NODE_ENV === 'production'

? '/hr' // production base url

: '/hr' // development base url

}

const instance = Axios.create(conf)

..........

访问时需要加前缀，前缀后面接的地址就是你自己平常访问的链接内容了。比如我平常本地访问的路径为http://localhost:8080/#/login，那么此时就是http://localhost:8080/hr/#/login

.----------------------

如果对于访问链接是有个前缀hr 看着非常碍眼的话，需要改动几个配置文件

1 前端配置接口访问路径去掉hr，及httpRequest.js去掉整个baseUrl

...........

const conf = {

headers: {

'Content-Type': 'application/json; charset=utf-8'

},

timeout: 60000 // 超时时间

}

const instance = Axios.create(conf)

..........

2后端需要加个配置文件，在子模块hr-backend新建文件夹及文件 xxxxx\hr-compay\hr-backend\src\main\webapp\WEB-INF\jboss-web.xml这样打包的文件就会在war包目录下的\WEB-INF\jboss-web.xml

该jboss-web.xml内容为

代表不需要jboss访问链接不需要上下文

然后重新打包部署即可。访问链接为 locahost:8080