# vue项目线上页面刷新报404 解决方法
在上线vue开发的前端网页上线后,刷新页面报404错误,因为网页上显示的是静态绝对路径,实际上服务器上是没有改路径的所以刷新汇报错误。
# vue框架中解决404
vue router
mode
默认为hash
, 这样的url
中带有#
,如果把mode: 'history'
就能去掉#号,也可以正常访问,但是再次刷新页面就会出现404
错误。
const router = new Router({
mode: 'history'
});
url
中带有#
,让有强迫症的人很不爽,可以去掉,去掉后就需要改nginx
配置文件了。
# 修改nginx配置文件
location / {
# ...
# 增加下列命令,index.html可换为项目中使用的其它文件名
try_files $uri $uri/ /index.html;
}
将上面代码放入nginx
配置文件中
保存退出
. ./nginx -t -- 验证nginx
配置文件是否正确
. ./nginx -s reload -- 重启nginx
记得修改完nginx
配置文件一定要重启nginx
不然没有效果!!!