本地使用vue-cli3的history模式出现页面无法访问的问题，可能是什么原因导致的？_编程开发

本地使用vue-cli3的history模式出现页面无法访问的问题，可能是什么原因导致的？

创始人

2024-11-30 02:00:59

0次

为什么在将vue-cli3本地调试切换为history模式后，页面无法访问？有哪些可能的原因？该如何解决？ | 问题分析：在vue-cli3中，使用history模式需要在路由配置中设置mode:'history'，这样可以去掉url中的#符号，使网站url更加美观。但是，如果在本地开发过程中使用了mode:'history'后，访问页面时可能会出现404错误或者无法访问页面的情况。这通常是因为我们在history模式下刷新页面时，浏览器会向服务器请求对应的资源，但我们本地并没有对应的资源，从而导致无法访问。解决办法一般有两种：

在项目根目录下新建一个vue.config.js文件，在该文件中配置如下代码： module.exports = { devServer:{ historyApiFallback:{ index:'/index.html' } } } 这样就可以将所有404的请求，都返回给定的index.html文件，这样就可以保证路由正确，在本地进行history模式的测试。
执行npm run build命令，将项目打包成静态文件，将dist目录下的文件部署到服务器上，即可正常访问，不存在本地无法访问的问题。解决方案：为vue-cli3配置devServer，在fallback选项中设置index.html作为回退页面。或者，将项目打包成静态文件进行部署。

上一篇：本地使用utf-8工作的PHP邮件程序在主机上无法工作。

下一篇：本地使用XAMPP主机托管的网站没有应用CSS。

本地使用vue-cli3的history模式出现页面无法访问的问题，可能是什么原因导致的？

相关内容

热门资讯