在vue预渲染项目在history模式下刷新无法正常页面
在vue预渲染项目在history模式下刷新无法渲染页面的问题刷新css样式不生效报错404const router = new Router({mode: 'history',routes: [{path: '/',component: mall,name: 'mall'...
在vue预渲染项目在history模式下刷新无法渲染页面的问题刷新css样式不生效报错404
const router = new Router({
mode: 'history',
routes: [
{
path: '/',
component: mall,
name: 'mall'
},
]
})
页面样式全乱了,看下页面请求加载的静态文件,所有静态文件都是404;
问题解决
修改为
<link rel="icon" href="/favicon.ico" type="image/x-icon" />
<link href="/static/css/style.css" rel="stylesheet">
即可成功加载css
原理解析
./ 是指用户所在的当前目录(相对路径);
/ 是指根目录(绝对路径,项目根目录),也就是项目根目录;
对于hash模式,根路径是固定的,就是项目的根目录,但是history模式下,以 / 开头的嵌套路径会被当作根路径,所以使用“./”引入文件,就会找不到文件了,因为文件本身就是在项目根目录下的,并不在嵌套路径这个目录下。
总结,无论hash模式还是history模式,可以直接使用“/”从项目根目录引入静态文件。
若遇到其他报错问题 ,请移步至我的博客
(
https://blog.csdn.net/weixin_44781409/article/details/89356758
https://blog.csdn.net/weixin_44781409/article/details/90671169
https://blog.csdn.net/weixin_44781409/article/details/90670731
https://blog.csdn.net/weixin_44781409/article/details/90670040
), 里面有部分报错问题的解决方法 ! 谢谢 !
更多推荐
所有评论(0)