vue3 vite打包部署后 在非根路由下刷新 报错?

Question

在根路由下刷新 正常

在非根路由下刷新 报错

导致页面只会显示根文件index.html里的内容(阻塞vue实例化)

Answer 1

可能是Nginx配置的问题，没有正确的处理路由，返回html内容

location / {
      #需要指向下面的@router否则会出现vue的路由在nginx中刷新出现404
      try_files $uri $uri/ /index.html;
      index index.html index.htm index.htm.gz cms/index.html;
      #强缓存配置
      add_header Cache-Control "public, max-age=86400";
    }

Answer 2

服务器错误地把静态资源（如 JS）也返回了 index.html，导致浏览器解析失败。
nginx添加如下配置：

location / {
  try_files $uri $uri/ /index.html;
}