美文网首页
【26.3】vue3学习 环境部署刷新404问题

【26.3】vue3学习 环境部署刷新404问题

作者: 王滕辉 | 来源:发表于2022-09-23 16:21 被阅读0次

    正常开发时没有问题,刷新访问也没有错误,但是通过 build 后部署到 nginx 上出现问题
    访问 http://ip:port 进入页面一切正常,点击链接也没问题,但是刷新F5操作时页面上出现 nginx的提示错误信息 404 not found

    image.png

    我原以为是vue的问题,通过百度查看发现是nginx的问题,由于vue在打包后只有一个页面,index.html作为入口页面,所有其他路由地址都是由js处理的,导致在nginx下直接访问其他地址是没有找到页面的,所以直接抛出了404错误。

    最终在router.vuejs.org的 网上找到答案对所有的地址从定向到index上。
    解决方案
    https://router.vuejs.org/zh/guide/essentials/history-mode.html#apache
    nginx 的配置中 增加 ‘/’ 的配置

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

    重新部署后刷新正常访问了

    相关文章

      网友评论

          本文标题:【26.3】vue3学习 环境部署刷新404问题

          本文链接:https://www.haomeiwen.com/subject/ahenortx.html