在vue预渲染项目在history模式下刷新无法正常页面

在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
), 里面有部分报错问题的解决方法 ! 谢谢 !