Vue + Docker + Nginx 部署时，子路由刷新就404的问题(非Nginx更改)

问题概览

最近的项目有用到Vue，找了个开源项目搭建起来，但是在部署的时候发现标题说的这个问题。 网上找了一圈说的都是：当你使用HTML5 模式配置你的路由时，子路由页面刷新后，出现部署需要更改部署的Nginx的配置，如下：

server {
      listen       80;
      server_name  localhost;

      root  /usr/share/nginx/html/;
      index index.html index.htm default.htm default.html;

    # Vue Router 配置
    location / {
      try_files $uri $uri/ @router;  # 尝试匹配URI，如果找不到，则转到@router定义的位置
      index index.html;
    }

    location @router {
      rewrite ^.*$ /index.html last;  # 重写URI为/index.html，并标记为最后处理，防止陷入循环
    }

    # 错误页面处理
    error_page   500 502 503 504  /50x.html;  # 定义500、502、503、504错误的处理页面为50x.html
    location = /50x.html {
      root   html;  # 50x.html页面所在的目录为html
    }
}

在官方文档中也是提到这样更改不同的历史模式：

还需要检查你的路由配置

但是当我实际更改Nginx的配置后并没有任何作用，在我黔驴技穷之时，我开始怀疑是不是直接更改vue路由就行？也就是图片里的这一段代码

让请求重定向到index.vue，vue就会接管请求定位到正确的页面上。试了一下果然是可以的！

index.js

  {
    path: "/:pathMatch(.*)*",
    component: Layout,
    hidden: false,
    children: [
      {
        path: '/:path(.*)',
        component: () => import('@/views/redirect/index.vue')
      }
    ]
  }