惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

腾讯CDC
博客园 - Franky
MyScale Blog
MyScale Blog
L
LangChain Blog
Martin Fowler
Martin Fowler
Recent Announcements
Recent Announcements
Stack Overflow Blog
Stack Overflow Blog
OSCHINA 社区最新新闻
OSCHINA 社区最新新闻
奇客Solidot–传递最新科技情报
奇客Solidot–传递最新科技情报
博客园 - 司徒正美
量子位
A
About on SuperTechFans
C
Check Point Blog
大猫的无限游戏
大猫的无限游戏
Last Week in AI
Last Week in AI
小众软件
小众软件
Apple Machine Learning Research
Apple Machine Learning Research
I
InfoQ
V
Visual Studio Blog
Vercel News
Vercel News
B
Blog
爱范儿
爱范儿
aimingoo的专栏
aimingoo的专栏
U
Unit 42

error on 打工人日志

k8s master 节点 Unauthorized kindle 邮件发送失败,错误代码E999 SELinux 问题:导致端口无法创建,无法访问 linux服务器进程打开文件过多导致服务异常 解决Elasticsearch索引只读(read-only) Linux 系统收包流程以及内核参数优化 githubAction set-output弃用错误 k8s CNI 问题 连接认证失效 k8s.gcr.io国内无法连接解决方法 K8S 问题排查:cgroup 内存泄露问题 docker 问题处理 安装 docker 出现 ERROR: Unsupported distribution 'ol' 问题
Vue3 + vite + nginx项目部署后404问题
作者 · 2023-08-10 · via error on 打工人日志

Vue3 + vite + nginx项目部署后404问题

vue3 + vite + nginx
在服务器上部署后打开首页都没问题,打开其他路径全部 404。
nginx 报错日志:No such file or directory

其实查看 build 后的dist文件夹可以发现,只有一个index.html,当你访问别的路径时nignx查找不到所以就报错了

解决方案

在 nginx.conf 中添加: try_files $uri $uri/ /index.html;

server {
          listen       80;
          server_name  localhost;
          location / {
          root   /dist;
          index  index.html index.htm;
          # 在配置文件的此处加上这句话
          try_files $uri $uri/ /index.html;
        }
    }

总结

其实上述改动就是告诉 nignx 找不到文件的时候就访问 index.html 就可以了。

究其原因其实就是是 vue3 的 router 使用了history模式,该模式与之前hash模式的具体区别可以自行百度一下,不在此赘述。