Nginx部署vue项目(单页面应用)刷新出现404
Vue项目打包之后,静态文件部署到nginx之后,我们访问项目一些子页面的时候,刷新会报404,这是因为刷新页面时访问的资源在服务端找不到,因为vue-router设置的路径不是真实存在的路径。针对这种问题,我们只需在nginx配置文件中加一些简单配置就可以,配置如下:server {listen80;server_namelo...
·
Vue项目打包之后,静态文件部署到nginx之后,我们访问项目一些子页面的时候,刷新会报404,这是因为刷新页面时访问的资源在服务端找不到,因为vue-router设置的路径不是真实存在的路径。
针对这种问题,我们只需在nginx配置文件中加一些简单配置就可以,配置如下:
server {
listen 80;
server_name localhost;
index index.html index.htm index.php;
root /html/dist; #你打包项目存放的位置
location / {
try_files $uri $uri/ @router; #检测文件存在性重定向到首页目录 防止404
index index.html;
}
location @router {
rewrite ^.*$ /index.html last;
}
}
最近在使用过程中又遇到了一些问题,使用上面的配置会报如下错误:
2020/09/22 15:08:26 [error] 8740#3308: *1 rewrite or internal redirection cycle while redirect to named location "@router",
只需要将上面location @router中的last改为break即可。
更多推荐
已为社区贡献2条内容
所有评论(0)