方法1：vue 路由没有使用history模式且vue项目打包上传直接放在Nginx的html文件夹中，通过以下配置访问html文件夹下的index.html文件即为项目首页
- build文件下的
untils.js文件中找到vue-style-loader增加publicPath: '../../'
- config文件下的
index.js文件找到build属性，修改assetsPublicPath: '/'为assetsPublicPath: './'
- 设置开发接口代理，这里的代理正是为 Nginx 配置做准备的
- 生产环境配置文件中配置访问的服务器域名，注意：因为前端项目运行访问socket时会默认带上
/socket.io/这个路由，所以初始化Socket客户端链接时的url为服务器域名即可！
- 使用
npm run build命令打包项目后将（static文件夹+index.html文件）上传到/usr/local/nginx/html/目录下，再配置nginx.conf配置文件，最后重启Nginx服务即可！
方法二：vue路由使用history模式，则需要按照以下步骤来操作
- 现有一个需求，如何用Nginx配置访问不同的前端项目？答：①配置多个二级域名并且设置https访问对应项目根路径的index.html文件即可；②基于Nginx的location进行配置（以下步骤使用这种方法）。
- 在方法一的基础上，修改
config文件夹下的index.js文件（注意是build内）：
- 修改
src/router/index.js文件，添加内容：base: '/frontend/',
-
然后执行命令：
npm run build，确保产生的index.html文件中静态资源路径都是在/frontend/文件夹下的，注意添加内容：<meta base=/frontend/>。
将打包后的文件上传到Nginx的html目录下，注意：
frontend文件夹下含static文件夹和index.html文件。
- 修改
nginx.conf文件：
- 以上 nginx 配置文件仍有缺陷，若手动刷新会导致页面404，故需修改一下请求根路径下的
/代码，让其重定向到特定路由：
location / {
root html;
index index.html;
try_files $uri $uri/ /frontend/index.html; #@qwe
}
#location @qwe {
# if ($request_uri ~* "^/frontend/.*") {
# rewrite ^(.*)$ https://xxxxxxx/frontend last;
#}
#if ($request_uri ~* "^/backend/.*") {
# rewrite ^(.*)$ https://xxxxxxx/backend last;
#}
#}
#xxxxxxx：表示域名
#^(.*)$表示匹配的路由
#https://xxxxxxx/frontend：表示重定向的路由
#last：表示本条规则匹配完成后，继续向下匹配新的location URI规则，同个代码块直接break
#~*：用于表示URI包含正则表达式，且不区分大小写
#$request_uri：表示除去$host剩下的部分
- 访问该项目：
个人域名/frontend。 - 新增Nginx访问不同前端项目都可以采用方法二进行处理！
