Nginx同server配置下配置多个localhost路由地址

nginx多页面路由配置，进入 nginx/conf/nginx.conf：

http {
......

server {
　　listen 80;
　　server_name localhost;
　　location / {
　　　　root C:\xxxx\xxxx\dist;
   　　try_files $uri $uri/ @router;
　　　　index index.html index.htm;
　　}

　　# 使用 alias 虚拟路径代理新页面路由
　　location /codesendbox	{
　　　　alias C:\xxx\xxx\dist\codesendbox; # 新页面或项目资源放到 root 资源目录下的相应目录（不然会找不到资源）
　　　　try_files $uri $uri/ /codeSendBoxDist/index.html;
　　　　index index.html index.htm;
　　}
　　error_page 500 502 503 504 /50x.html;
   location @router{
    　　rewrite ^.*$ /index.html last;
   }
}

......
}

关于通一个 serve 代理多个location路由地址：

1. vue.config.js文件中，修改根路由路径（为了解决与主项目路由产生冲突），比如修改为：publicPath: "/codesendbox"，项目启动后地址为：localhost:8080/codesendbox

2. 根据上方的步骤配置 nginx

 

 个人博客站点：www.devloper.com  博客、视频教程与插件工具

-- 时间是个常数，但也是个变数。勤奋的人无穷多，懒惰的人无穷少。 --