Springboot+vue（使用Nginx发布vue）

一：开发环境

1、Sprinbgoot的后端配置

       后端没有任何项目路径，如登录接口就是：localhost:8080/login

2、前端vue配置反向代理

 lcoalhost:3001/${process.env.VUE_APP_BASE_API}/login  会自动代理到  localhost:8080/login,其中${...API}为环境变量。这里为了方便使用stage-api

二：开发环境

     后端不是很简单，这里着重将vue的部署，vue部署分为2种，一是直接打包放到后端的/resource文件夹下，而是部署到nginx中。这里主要第二种。

    vue打包部署配置nginx：第一步，通过nginx访问vue打包的index.html的静态页面。第二步：配置访问后端API的接口（即开发环境的devServer在打包后失效）。

1. vue打包：npm run build

2.安装Nginx

(1) 在nginx目录下的html目录下，新建一个项目文件夹（我建立的是visWeb）

（2）将vue的dist全部移动这个文件夹下

（3）Nginx配置vue的index.hmtl

(4) 配置Nginx的Api的反向代理

主要是 ip:9527/stage-api/xxxx转到后端访问 ip:8080/xxxx

到这里部署完成

解决页面刷新404的问题：

第一步：vue项目的路由改成hash模式。

第二步：nginx配置文件重试

第三步：刷新nginx