springBoot + vue前后端分离项目如何部署到服务器（尝试各种方法终究是路径问题导致无法正常登录）

第一步：命令行npm run build将前端打包成静态文件（一般会在dist目录下生成static文件夹以及index.html文件）

上图为：config目录index.js配置的build以及dev命令，如果你没找到static文件夹及index.html，到这里看一下你的路径是否配置的是dist路径；

第二步：在你后台的资源(resources)目录下新建一个static文件夹将打包好的静态文件夹及index.html文件一起复制到该文件夹下，

此时，就可以直接运行项目本地测试跑起来，ok,没有任何问题，但是登录时却出现了问题，无法正常登录404,找不到资源路径；开始查找原因，这将是一个非常漫长且有趣味的过程；因为在springboot+vue的项目所有路径都会通过org.apache.shiro.web.filter.authc.FormAuthenticationFilter过滤器进行拦截；

过滤器拦截的过程中，会验证该登录的url是否为一个登录的url，即是否“/login”，问题找到了，为什么直接使用前端8080端口直接是“/login”，打包成静态文件之后就改变了呢，找到api目录下http.js，问题在于打包之后的静态文件,会将url整合传到后台，此时的路径自然会被拦截,

此时将

const adminApiGateway = '/api'的/api去掉即可解决问题。

第三步：通过package将项目打包成jar包，生成在target目录下面，将该jar包上传到服务器的某个文件夹下（比如：usr/java下）

 

第四步：通过命令启动项目

1.ps -aux|grep + jar包名.jar --查看进程

2.kill -s 9 + 进程号 --杀进程

3.nohup java -jar + jar包名.jar > console.log 2>&1 & --启动进程（在此之前可以在同级目录下新建一个console.log文件用来存放日志信息，可以随时下载console.log查看项目运行状态）

完成启动，地址加端口号即可访问，如果你配置了项目名在端口号后面加上你的项目名即可