如何解决VUE中设置mode为history时页面显示空白的问题？

本文共计261个文字，预计阅读时间需要2分钟。

当在 `router.js` 中设置 `mode: 'history'` 后，发现刷新页面不显示，原因是由于历史记录的请求路径资源不存在。需要后端配置及前端修改一个地方即可。

后端配置：javascript// 修改后端路由配置，确保请求路径资源存在

前端修改：javascript// 修改前端配置，例如在webpack的devServer中devServer: { port: 8000, host: '0.0.0.0', overlay: { errors: true, warnings: true }}

当router.js 中mode:history 发现刷新页面 不显示了，原因出来history的请求路径资源不存在了，这个需要后端配置的，

前端 需要修改一个地方即可,

devServer: { port: 8000, host: '0.0.0.0', overlay: { errors: true }, hot: true, historyApiFallback: { index: '/index.html' } },

新增historyApiFallback这个个功能，然后的index的路径需要配置output输出的Publicpath的配合使用

publicPath:'/public/'

对应的路径 index:'/public/index.html'

重启webpack，刷新页面就好了

以上这篇VUE 解决mode为history页面为空白的问题就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持易盾网络。