Vue + Spring Boot 打包成 war 项目于 Tomcat 部署过程

打包准备工作


1.  涉及到 Tomcat 的 ServletContext 路径,一般名称为 war 包名称,需要首先查看 maven 打包工程 pom.xml 文件。

找到 build > finalName 标签的值,一般该值就是 war 包的名称。当前最终打包 jeeplus.war。

Vue + Spring Boot 打包成 war 项目于 Tomcat 部署过程

 

修改 Vue 的请求地址,一般可能我们是写成没有 ServletContext 的请求地址,打包时需要加上 ServletContext,也就是这里的 /jeeplus。

Vue + Spring Boot 打包成 war 项目于 Tomcat 部署过程

 

修改 vue.config.js 中的 publicPath。

Vue + Spring Boot 打包成 war 项目于 Tomcat 部署过程 

2. 使用 npm run build 开始打包。打包完毕你会得到一个 dist 文件夹。

Vue + Spring Boot 打包成 war 项目于 Tomcat 部署过程 

将 dist 文件夹里的所有东西都拷贝到 Spring Boot 的 resources/static 目录下(没有就新建 static)

Vue + Spring Boot 打包成 war 项目于 Tomcat 部署过程

 

用 mvn package 命令打包

Vue + Spring Boot 打包成 war 项目于 Tomcat 部署过程

 

打包之后应该会获得一个 target 目录,其中包含 war 工程。

Vue + Spring Boot 打包成 war 项目于 Tomcat 部署过程

 

 

 将该 war 工程放到 tomcat/webapps 目录下即可。如果 tomcat 处于运行状态也不必关闭;直接覆盖原来的 war 工程也没有影响,Tomcat 会自动解压运行。