springboot+vue项目部署至虚拟机

在部署项目前，配置好Nginx、mysql、redis、jdk和Tomcat。

部分参考：

Linux服务器或虚拟机部署springboot+vue项目_linux部署springboot+vue项目-CSDN博客

使用Nginx部署Vue+SpringBoot前后端分离项目(超详细！)_nginx部署前后端分离的项目-CSDN博客

一、虚拟机部署

1.Tomcat

后端部署在Tomcat上，打包成war包放至webapps目录下。

在启动前，关闭防火墙。

 systemctl stop firewalld

2.Nginx

前端npm run build打包成dist放至到虚拟机自定义目录下，只要将Nginx的配置文件中root后修改为该目录。

location / { root 你的前端目录/dist/; # 网站文件的根目录 
            index index.html index.htm; # 默认的索引文件 }

（1）启动服务时，报错：

nginx: [emerg] bind() to 0.0.0.0:80 failed (98: Address already in use)
nginx: [emerg] bind() to 0.0.0.0:80 failed (98: Address already in use)
nginx: [emerg] bind() to 0.0.0.0:80 failed (98: Address already in use)
nginx: [emerg] bind() to 0.0.0.0:80 failed (98: Address already in use)
nginx: [emerg] bind() to 0.0.0.0:80 failed (98: Address already in use)

解决方法：查找此时占据80端口的进程，杀死。重启服务。

（2）打包后部署Nginx，字体style不显示

报错：Failed to decode downloaded font

解决方法：控制台发现字体访问路径出错，路径中出现重复（如：https://_asset/_asset/xxxx.tff），修改前端vite.config.js文件，将base：'./'   修改为base：'/'

(3)图片显示失败

解决方法：将asset中的图片资源放至public目录下再打包。