在使用 Vue 3 和 vue-router 时,如果在打包后使用 history 模式访问页面出现一片空白,可能是由以下几个原因造成的。下面我将逐一说明可能的原因以及相应的解决方案: 项目是否正确引入了 vue-router,并检查其版本是否与 vue3 兼容: 确保你已经正确安装了 vue-router,并且其版本与 Vue 3 兼容。Vue Router 4....
vue 3.0用history路由打包后出现空白页面 原因: 项目没有放在服务器根目录下,放在了服务器的data/app下,那么打开地址是:http://example.com/data/app 但配的路由中并没有data/app,无法找到路径中的组件,所以也就无法渲染了。这就是导致空白的原因 解决方法1: 修改router中的index.js,给路由中加一个base的属性...
index index.html index.htm; #error_page 404 /history/index.html; if (!-e $request_filename) { rewrite ^/(.*) /history/index.html last; breahttp://k; } } 上面这个是项目路径名为history,这样配置后就不会有vue打包后页面空白问题了,history路由也可以自由访问了,不过要记得上面说的,非根目录...
});/*eslint-disable no-new*/newVue({ el:'#app', router, components: {App}, template:'<App/>'}); 问题:页面空白 mode: 'history',使用这个模式,在开发阶段一切都是正常的,访问地址是localhost:8888,以上没什么错误,一切都好用。url里也没有#了。可是打包之后,访问项目会发现页面一片空白的情况。...
第三个问题:router-view中的内容显示不出来。路由history模式 这个坑是当你使用了路由之后,在没有后端配合的情况下就手贱打开路由history模式的时候,打包出来的文件也会是一片空白的情况, 解决: 在 router.js 中将 mode: history注释掉 非常珍贵的config.js文件值得你收藏...
在最初用vue+webpack+vue-router做项目的时候,在本地pc开发测试都是正常的,但是在把代码打包部署到测试服务器之后,访问项目首页总是白屏。 第一种,打包后的dist目录下的文件引用路径不对,会因找不到文件而报错导致白屏。 解决办法:修改一下config下面的index.js中bulid模块导出的路径。因为index.html里边的内容都...
所以呢在history模式下http://localhost:8081/personalcenter就理所因当的被当做根路径了，这也就是造成我们刷新为空的主要原因。问题解决我的项目是vue2.x的项目，至于3.x的同理，作为前端小白在遇到这个问题时我查找了很多资料甚至在某宝上请教了些前辈，他们的说的大致类似首先现在build->config路径下...
由于公司的业务需求,需要把之前一些以hash模式运行的项目修改成history模式, 结果在本地调试都很正常,但在打包上线之后出现了白屏的问题, 资源引入正常,控制台也没有报错 页面资源加载正常,但没有被渲染 // 看到官方文档说需要配置服务器,于是在本地Apache一顿改,但并没有解决,不过皇天不负有心人,让我找到了解决...
1.前端打包路径修改写死 在history 模式中切换路由时,我们是真正改变了页面的 url 路径,所以webpack的runtime会认为它位于example.com/some/path。如果publicPath是设置的相对路径,那么webpack加载chunk时可能会变成example.com/some/path/static/js/3.js这样的路径,然而chunk的真正路径是example.com/static/js/3.js...