巨坑!nginx部署vue项目后刷新页面404，重定向不生效问题（已解决

云雨毅

已于 2023-08-18 13:54:29 修改

阅读量1.5k

点赞数

CC 4.0 BY-SA版权

分类专栏：问题总结文章标签： vue.js nginx 前端

于 2023-08-18 11:16:45 首次发布

本文链接：https://blog.youkuaiyun.com/weixin_44508740/article/details/132357954

问题总结专栏收录该内容

12 篇文章

订阅专栏

文章讲述了在部署Vue项目时遇到404问题，通过添加重定向代码尝试解决但未果。最终作者揭示了两个关键点：确保server_name使用具体IP而非localhost，以及root目录指向Vue项目实际文件位置，包括在Docker部署时的路径调整。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

这几天部署vue项目后发现刷新页面会404，想到之前的经验添加重定向代码即可解决。

 try_files $uri $uri/ /index.html;`

添加代码后还是404，找不到vue文件。
解决方案：使用最基本的nginx配置。

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

这段代码没有问题。有两个注意点大多数人都没有提到
1、server_name不能写localhost，请写具体IP！！！
2、root 的目录地址是到能看到vue项目index的地方，如果是docker部署，请写docker中vue所在的目录。