后端 SpringBoot + 前端 vue 打包发布到Tomcat

近段时间 做了一些前后端的开发 需要在Tomcat里进行发布    把自己整理的分享出来

后端打包

pom.xml 文件

 <packaging>war</packaging>

<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-tomcat</artifactId>
<scope>provided</scope>
</dependency> <--去掉内置的Tomcat-->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-web</artifactId>
<exclusions>
<exclusion>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-tomcat</artifactId>
</exclusion>
</exclusions>
</dependency> <build>
<plugins>
<plugin>
<groupId>org.apache.maven.plugins</groupId>
<artifactId>maven-war-plugin</artifactId>
</plugin>
</plugins>
</build>

启动类:Application

@ServletComponentScan
@SpringBootApplication //继承SpringBootServletInitializer 类
public class Application extends SpringBootServletInitializer {
   public static void main(String[] args) {
      SpringApplication.run(Application.class, args);
   }
//重写configure方法
@Override
protected SpringApplicationBuilder configure(SpringApplicationBuilder builder) {
return builder.sources(Application.class);
}
}

在终端执行命令 mvn clean package

后端 SpringBoot + 前端 vue 打包发布到Tomcat

项目刷新 会多出一个target目录

后端 SpringBoot + 前端 vue 打包发布到Tomcat

.war的包 拷贝到Tomcat的webapps目录下即可 

后端 SpringBoot + 前端 vue 打包发布到Tomcat

效果如下:(开启tomcat)

传送门

前端vue 打包

输入指令 : npm run build

项目目录会多出一个 dist目录 如下所示:

后端 SpringBoot + 前端 vue 打包发布到Tomcat

将dist目录拷贝到Tomcat 下的webapps目录下即可 :

后端 SpringBoot + 前端 vue 打包发布到Tomcat

效果如下:(开启tomcat)

传送门

文章借鉴于:https://yq.aliyun.com/articles/479023

上一篇:(一)javascript中的数组index属性——获取数组的索引值


下一篇:Android笔记之 图片*裁剪