vue使用history路由模式后打包空白

最新推荐文章于 2025-03-18 09:53:02 发布
最新推荐文章于 2025-03-18 09:53:02 发布
阅读量1.7k 收藏
点赞数
分类专栏： vue开发
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/smlljet/article/details/89713837
版权

vue路由默认是hash模式，改成history路由模式可以去掉#,这个除了需要后端服务配合外，config文件修改如下
在这里插入图片描述

vue history 模式下打包 上传服务器后 空白
匹夫的博客
07-22 641
我们一般解决Vue下的路径中 # 号的问题是 修改vue-router 的模式为history 项目搭建的时候使用了 vue-router export default new Router({ mode: 'history', base: '/dist/', routes: [ { path: '*', name: 'PromotionAgreement', component: PromotionAgreement, }, ..
VUE 解决mode为history页面为空白的问题
10-16
在Vue.js应用中，`mode: 'history'` 是Vue Router的一种路由模式，它使得URL的改变不再依赖于`#`（哈希符号），而是基于HTML5 History API，提供了更友好的URL。然而，启用这一模式后，可能会遇到刷新页面时内容空白...
Vue下路由History模式打包后页面空白的解决方法
12-09
vue的路由在默认的hash模式下,默认打包一般不会有什么问题,不过hash模式由于url会带有一个#,不美观,而且在微信分享,授权登录等都会有一些坑.所以history模式也会有一些应用场景.新手往往会碰到history模式打包后页面一片空白的情况,而且没有资源加载错误的报错信息. 这个其实仔细研究下会发现,如果项目直接放的跟目录, 那么是没有问题的,如果是子目录,那么就会一片空白了.这个vue官方有解释,需要加一个base // base: '/history', // mode: 'history', 这个base即为项目路径. 以上两个都解决了,还是会发现,此时只有首页能访问,通
vue项目打包后预览空白
最新发布
qq_33298964的博客
03-18 513
【代码】vue项目打包后预览空白。
VUE - history模式打包后在服务器上页面空白的问题
weixin_44880056的博客
03-15 339
history模式打包后在服务器上页面空白的问题 解决方法 ----- 在base添加 /服务端文件名/
vue2打包后打开网站页面空白
BiangBaing的博客
08-17 2269
众所周知，Vue路由有两种模式，默认hash模式，这种模式下url上会带"#“，因此很多公司开发都不使用hash模式而选用另一种history模式，因为history模式下的url不会带上”#“。不带”#"既是history模式的优点，同时也让它带来了一些烦人的问题，比如打包部署页面刷新为空白页，使用嵌套路由刷新为空白页的问题。今天我就分享下我解决嵌套路由刷新的问题。问题分析以下是我学习/测试时写的二级路由。...
vue路由history模式
liuxuanwei1998的博客
07-12 1146
1
vue项目打包后打开页面空白解决办法
08-27
如果开发者尝试将路由模式改为history模式（例如：http://localhost/example），则可能导致打包后的页面空白。这是因为history模式对服务器的配置有特定要求。服务器需要能够识别所有路由，当请求的路径与服务器上...
处理 vue history模式打包后页面为空白页的问题
qq_21460133的博客
09-07 1173
vue history 模式打包后页面空白页问题记录
vue -- vue-router的history模式打包后页面空白的解决方案
热门推荐
积少成多
07-25 2万+
欢迎访问我的个人博客：http://www.xiaolongwu.cn 前言 采坑记录，以便后面翻阅 首先你需要确认页面空白不是由资源文件路径不正确引起的，如果资源找不到就将绝对路径改为相对路劲，具体解决方案看这里：webpack–资源和css中图片引用打包为相对路径的方案 问题现象 在本地开发环境没有任何问题，路由也正常显示，但是打包并部到服务器之后，访问页面就是空白，看控制台...
vue-cli项目打包后样式空白（或者是样式出现一部分）_vue3 构建后部分样式丢失,重新构建后出现(1)
2401_84433974的博客
05-16 578
什么是MVVM？mvvm和mvc区别？它和其它框架（jquery）的区别是什么？哪些场景适合？组件之间的传值？Vue 双向绑定原理描述下 vue 从初始化页面–修改数据–刷新页面 UI 的过程？虚拟 DOM 实现原理Vue 中 key 值的作用？Vue 的生命周期Vue 组件间通信有哪些方式?vue 中怎么重置 data?组件中写 name 选项有什么作用？Vue 的 nextTick 的原理是什么？Vuex 有哪几种属性?解决：到config文件夹中打开index.js文件。
vue使用history模式页面空白
qq_29972895的博客
05-12 1428
之前负责了一个项目，使用的是vue。为了避免在地址链接的时候出现问题后端要求去掉#号，也就是使用history模式。 更改history模式后打包部署后发现页面空白。查询了下官网的文档资料https://router.vuejs.org/zh/guide/essentials/history-mode.html#后端配置例子后端需要同步配置才能使用history模式。 但是依旧不可用，查了下由于我是在子目录下的，所以需要在路由配置文件添加一行代码。 ps: 虽然这样解决了问题，但是这样的.
Vue项目打包部署后页面空白，无报错，为什么大公司一定要使用微服务
2401_83977357的博客
04-04 750
归根结底是因为打开页面后没有匹配到任何一个路由，也就是设置在router里的路径没有任何一个被匹配到，包括其中设置的path:"/"这个路径，因此也就无法加载对应的组件，所以显示一片空白；官网原文：vue-router默认使用的是hash模式，如果要改成history模式，需要在router中将模式改成history，也就是})
vue路由及打包部署
m0_61598337的博客
08-20 721
路由表主要记录hash（#号）与组件之间的对应关系。主要定义在router文件夹下的index.js},routes})若path值为/emp，则绑定的是../views/tlias/EmpView.vue，即为一条路由信息。Vue.use(VueRouter)使用vue路由，const routes = [{}]构建路由表，const router = new VueRouter({})实例化路由表对象。
vue项目的mode:history模式打包空白
大大黄的博客
04-09 2900
Vue-router 中有hash模式和history模式，vue的路由默认是hash模式，一般开发的单页应用的URL都会带有#号的hash模式，因为整个应用本身而言就只有一个HTML，其他的都是通过router来渲染。简单介绍下两种模式： hash —— 即地址栏 URL 中的 # 符号（此 hash 不是密码学里的散列运算）。比如这个 URL：http://www.abc.com/#/hell...
介绍Vue router的history模式以及如何配置history模式
m0_62396648的博客
07-08 1万+
history模式使用浏览器的history API来管理路由状态，而不是依赖于URL中的哈希。在history模式下，URL看起来更加整洁，没有#符号。例如，history模式可以在不刷新整个页面的情况下，通过改变URL来切换页面，实现更加流畅的用户体验。
Vue打包遇到的坑。。。。history和hash模式也会产生区别
CheckMate_Room的博客
09-20 3151
Vue项目再进行打包时，各位小伙伴肯定遇到各种状况，下面我来总结下我所遇到的状况。 1. 打完包之后,请求static文件夹中的文件出现空白页，f12 提示 404。  在config文件夹中打开index.js，更改assetsPublicPath为'./'，个人理解光是"/"代表的是根目录，"./"代表相对路径。 如果你放在服务器上的根目录的话，没有差别；如果放在文件夹内部的时候，"....
vue-cli 打包出来的文件缺少_解决vue-cli脚手架打包后vendor文件过大的问题
weixin_39629989的博客
12-22 667
大家会遇到打包后文件很大，导致页面初始化加载的速度很慢。会出现白屏的现象。这一般是你打包的vendor太大的缘故。如果你打包后看到你的vendor文件有700kb以上。你就要考虑怎么处理。处理这种文件的1、把不常改变的库放到index.html中，通过cdn引入，比如下面这样：然后找到build/webpack.base.conf.js文件，在 module.exports = { } 中添加以下...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值