- tomcat默認端口 8080
- springboot端口 9132
- vue 端口 9131?
框架?
項目是基于SpringBoot+Vue前后端分離的倉庫管理系統
- 后端:SpringBoot + MybatisPlus
- 前端:Node.js + Vue + element-ui
- 數據庫:mysql
?一. 打包Vue項目
cmd中輸入命令?npm run build?后就可打包成功
打包完成后項目路徑下會生成一個新的文件夾dist,打包后的東西都在里面
二、整合Vue項目和SpringBoot項目
將Vue項目dist文件夾下的所有文件Copy到SpringBoot項目的resource/static目錄下
(沒有static就新建 一個static文件夾)
?然后配置Spring
三、修改Pom文件
?
-
1. 設置打包為war包(如果不需要可以不設置)
? ? 默認打包成 jar包?
想要打包成war包,需要在pom文件中添加以下這一行
<packaging>war</packaging>
-
2 . 排除掉 web 里面自帶的 Tomcat
-
只需要在spring-boot-starter-web 這個依賴上添加如下內容:?
<exclusions><exclusion><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-tomcat</artifactId></exclusion>
</exclusions>
-
3. 添加一個自己的 Tomcat
?添加以下依賴:
<dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-tomcat</artifactId><version>2.7.5</version><scope>provided</scope>
</dependency>
查看
spring-boot-starter-tomcat
的版本?進入你的Maven本地倉庫目錄(默認是
~/.m2/repository
),然后導航到org/springframework/boot/spring-boot-starter-tomcat
目錄,該目錄下會包含不同版本的文件夾,版本號就包含在這些文件夾名稱中。
四、添加配置類?
在SpringBoot同級目錄下添加一下配置類ServletInitializer
讓其繼承一個類:SpringBootServletInitializer,并且覆蓋 configure 方法,在方法中添加 return builder.sources(WarehouseSystemApplication.class);?
其中:WarehouseSystemApplication.class是?啟動類類名(每個人都不一樣)
?
package com.rabbiter;import org.springframework.boot.builder.SpringApplicationBuilder;
import org.springframework.boot.web.servlet.support.SpringBootServletInitializer;public class ServletInitializer extends SpringBootServletInitializer {public ServletInitializer() {System.out.println("初始化ServletInitializer");}@Overrideprotected SpringApplicationBuilder configure(SpringApplicationBuilder application) {return application.sources(WarehouseSystemApplication.class);}
}
或者重新寫一個類 SpringBootStartApplication,和WarehouseSystemApplication平級,
package com.rabbiter;import org.springframework.boot.builder.SpringApplicationBuilder;
import org.springframework.boot.web.servlet.support.SpringBootServletInitializer;
public class SpringBootStartApplication extends SpringBootServletInitializer {@Overrideprotected SpringApplicationBuilder configure(SpringApplicationBuilder builder) {// 注意這里要指向原先用main方法執行的Application啟動類return builder.sources(WarehouseSystemApplication.class);}
}
五、設置 configurations
Run -->Edit Configurations
??
?
???
???
六、選擇Tomcat運行
???
運行后自動調轉網頁?
??
?七、跨域問題
存在跨域問題,不處理的話登錄時會出現如下問題AxiosError: Network Error?
???
要么設置跨域訪問(各種操作后還是不行,后續解決)
要么把tomcat/springboot/vue端口都設置一致,比如都設置為 9131 (完美解決~)
??