nginx 部署vue 项目多页面配置

普通的vue 都是SPA 单页面的。
什么是SPA
单页Web应用（single page application，SPA），就是只有一个Web页面的应用，
是加载单个HTML页面，并在用户与应用程序交互时动态更新该页面的Web应用程序
单页面应用程序：
只有第一次会加载页面, 以后的每次请求, 仅仅是获取必要的数据.然后, 由页面中js解析获取的数据, 展示在页面中
传统多页面应用程序：
对于传统的多页面应用程序来说, 每次请求服务器返回的都是一个完整的页面
优势
减少了请求体积，加快页面响应速度，降低了对服务器的压力
更好的用户体验，让用户在web app感受native app的流畅
单页面 vue 部署配置

 server {
        listen       80;
        server_name  localhost;
	    root /usr/share/nginx/html/dist/;
		 location / {
             try_files $uri $uri/ @router;
             index index.html;
         }
       

        location @router {
             rewrite ^.*$ /index.html  last;
        }
		
        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   html;
        }
    }

最近系统实现了多页面配置，于是nginx 改为如下：

server {
        listen       80;
        server_name  localhost;
	    root /usr/share/nginx/html/dist/;
		 location / {
             try_files $uri $uri/ @router;
             index index.html;
         }
       

        location @router {
            # rewrite ^.*$ /index.html  last;
           # 多页面 时刷新配置如下 
            rewrite ^((?!/(problemInv|code)/*).)*$ /index.html last; 
            rewrite ^/problemInv/*  /problemInv/index.html  last;
            rewrite ^/code/*  /code/index.html  last;
        }
		
        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   html;
        }
    }