页面无法访问vue-router.esm.js:2314 Error: Loading CSS chunk (filename) failed.页面跳转失败

最新推荐文章于 2024-03-18 10:39:05 发布
最新推荐文章于 2024-03-18 10:39:05 发布
阅读量521 收藏 1
点赞数
分类专栏： 前端 vue router 文章标签： javascript vue.js css
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/SHERLOCK_96/article/details/127735990
版权
前端 同时被 3 个专栏收录
20 篇文章 0 订阅
订阅专栏
vue
10 篇文章 0 订阅
订阅专栏
router
2 篇文章 0 订阅
订阅专栏

在这里插入图片描述
本地跳转页面没问题，发到test环境无法跳转报错，如图，报错的文件是vue文件，但是报错中的后缀是css
问题原因是路由中的webpackChunkName配错了，前面多了个/，导致打包后地址不对，遇到此问题可以检查一下这个参数配的是否正确

东方椰树椰汁
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
专栏目录
详解Vue项目中出现Loading chunk {n} failed问题的解决方法
10-18
主要介绍了详解Vue项目中出现Loading chunk {n} failed问题的解决方法，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
Error: Loading CSS chunk chunk-b0a1 failed. 报错解决
qq_36454619的博客
08-06 6436
问题描述： 部署到服务器上的项目有一个页面进不去（本地可以进）。 浏览器控制台报错如下： 来自“http://XXX.css”的资源已被阻止，因为 MIME 类型（“application/json”）不匹配（X-Content-Type-Options: nosniff）。 Error: Loading CSS chunk chunk-b0a1 failed. (/XXX/static/css/chunk-b0a1.XXX.css) 问题排查： 发现该css文件为0kb，怀疑因此加载时产生错误。
vue中loading chunk-xxx.css failed和net::ERR_ABORTED 404 解决方法
红烧大熊猫的博客
12-27 8425
文章目录前言1. 问题现象2. 解决方法3. 总结问题出现原因 前言 本文只是记录了自己经历项目出现的Loading chunk-xxx.css failed问题出现的原因和解决方法，该问题出现的原因可能和项目所使用的框架有关，并且出现的条件比较苛刻，可能并不适用于所有的情况，具体可看文章的第3部分3.总结问题出现原因，这里仅展示了一种解决思路。 项目的框架是：vue 2.6.10 + element-ui 2.11.1 "dependencies": { "core-js": "^2.6.5"
chunk-libs.86e06e39.js:98 Error: Loading CSS chunk chunk-2de0 failed.
qq_44952713的博客
08-25 272
描述：前端打包在服务器上运行，跳转页面时无法成功跳转，控制台出现该错误。解决：控制台点进去发现报错的css文件为空，去项目找找vue文件，把。标签为空的填上内容就好了。
Loading chunk * failed错误
最新发布
one、two、three，go的博客
03-18 983
【代码】Loading chunk * failed错误。
Cannot find module ‘xxx’，错误解决方法
01-08
vue-router.esm.js:1897 Error: Cannot find module '@/views/login/index' at webpackEmptyContext (index.js:39) at permission.js:90 解决方法 进入router中的index.js component: () => import('@/views/login/...
try-vue3-bundle_webpack-vs-vite:1.分析vue3＆webapck4，chunk-vendor代码来源； 2。分析vue3＆vite，chunk-vendor代码来源； 3。 vite对cmd代码处理？
04-05
在Webpack中，"chunk-vendor"通常包含了所有依赖的第三方库，如Vue.js本身、Vuex、Vue Router等。Webpack通过分析项目中的import语句，将这些外部依赖抽取出来，形成一个单独的chunk，以实现代码复用和缓存优化。...
线上项目路由跳转报错 Loading chunk failed
yueye_wu的博客
08-18 5192
线上项目路由跳转报错 Loading chunk failed
Vue开发中出现 Loading Chunk-###... Failed 的问题解决
weixin_67140738的博客
10-12 4273
当访问了项目的某个界面（其他界面未访问，也就是未加载资源）时，加载了打包后的index.html入口文件，入口文件中会有其他异步加载的对应包，而在重新打包后这些包的名称发生了改变，这时候重新发布了项目。里面有跳转对应界面所需要的文件，但是这个文件是之前版本的文件，也就是说当你跳转一个未加载资源的界面，这时候用错误的路径去加载，然后报错。例如，如果的静态资源存放在CDN上，我们需要将publicPath配置为CDN的地址。例如，如果我们的打包文件需要输出到指定的目录下，我们需要将output配置目录的路径。
larave+vue history 模式 刷新回到首页 空白 Error: Loading chunk 1 failed.（laravel-mix）
个人学习记录
05-16 400
最近想吧商城项目由原来的 laravel 和 vue 分开写的（相当于两个项目，很多人觉得麻烦，然后很多人不会用），现在想把他整合到一个项目里面用laravel-mix来使用，之前也有个项目mix整合的，整合的时候直接全部生成在public 目录所有没有任何问题，这次想把打包文件放入到dist目录 各种报错来了，特别是这个 用hash模式没有任何问题，切换到history就开始了， 点击切换到子页面，从子页面再跳转其他页面，出现这些问题，在首页第一次切换路由没有问题，然后在子页面进行刷新，直接跳转到首页空
Vue开发中出现Loading Chunk Failed 踩坑纪实
weixin_54079992的博客
03-31 3853
解决LoadingChunkFailed,并且探究产生的原因,以及复现问题的方法
关于vue前端syntaxerror unexpected token...报错
disanxiaoyao的博客
04-03 2万+
关于vue前端syntaxerror unexpected token...报错vue前端syntaxerror unexpected token。。。报错，注意：是syntaxerror unexpected token。。。而不是uncaught syntaxerror unexpected token。。。 重要的事要三个感叹号！！！一：删除webstorm的.idea文件二：删除项目中...
Loading chunk (\d)+ failed 错误方案
sunluyi的博客
01-10 4811
已经上线的项目在正式服运行正常，过了一段时间需要该需求，放在测试上一跑一直报错，并且是4个人测试时，两台电脑没问题，运行正常，另外两个人一直出这个错误。 百度了一下，网上有很多关于这个问题的修改方式。 这个问题出现概率比较小但是一旦出现就会导致页面崩溃，参考了网上众多大佬的文章，最后采用vue-router的错误处理函数 onError解决问题 ...
vue项目上线报loading chunk * failed 错误[已解决]
weixin_48156531的博客
11-30 7376
vue项目上线报loading chunk * failed 错误 我是刚写完的vue后台管理项目，上线部署到nginx上，然后本地测试没毛病，线上就是报这种错误，查了很多资料，大部分都是这种方法： 就是把将 config / index.js的build的路径assetsPublicPath改为‘/’ 可能是我自己项目的原因并不好使 最后找到了解决办法，是路由懒加载的原因 解决： let scrollview = () => import('@/pages/innovation/scrollvi
vue部署到线上时，Loading chunk xxx failed 问题
热门推荐
weixin_40918145的博客
09-26 4万+
如图所示，今天遇到了一个奇怪的问题，做了两套路由，超级管理员一套，普通管理员一套，从超管切到普管页面的时候，普管的权限页面怎么点击都是报Loading chunk xxx failed问题，而在本地没有这个问题，从网上的方法得知，将config / index.js的build的路径assetsPublicPath改为‘/’,就好了，而本地的是早就设置了‘/’，所以没有这个问题...
Error: Loading chunk * failed，Vue Router懒加载报错问题解决方案
小圣贤君的博客
07-09 4万+
最近vue项目路由改成了懒加载方式，刚开始并没有什么问题，清空项目文件，重新下载配置运行后，就发现控制台报以下错误： [vue-router] Failed to resolve async component default: Error:Loading chunk 10 failed. 刷新页面后，就不会再报错，思来想去应该使用路由懒加载后，组件加载异常导致的，但是究竟是什么原因，暂时不知...
Vue项目中出现Loading chunk {n} failed问题的解决方法
Uncle_long的博客
01-30 1万+
由于项目里面用到了vue-router，vue-router的错误处理函数 onError 是不是能够捕获该错误呢？我们来看一下官方文档的说明: 当在渲染一个路由的过程中，需要尝试解析一个异步组件时发生错误。 完全符合我们场景，所以在onError方法中我们实现如下代码： router.onError((error) => { const pattern = /Loading ...
css加载失败的原因是什么？
高先生的猫
01-06 1416
有很多刚刚接触css的新手有时会遇到css加载失败这个问题，但测试时，网页上没有显示该样式的问题，这就说明CSS加载失败了。那么为什么会加载失败？css加载失败的原因是什么？ 造成css加载失败的原因有很多，这可能跟你代码出错，浏览器、路径、编码等等都是有关联的。所以在具体情况具体分析。最常见的失败原因有以下几类： 1、网络原因 IIS空间不足、浏览者网速慢、空间速度慢等网络因素是造成CSS加载失败的原因之一，其具体表现为：当我们打开网页时，网页布局完整，但却没有任何布局样式显示。 2、..
Uncaught (in promise) TypeError: Cannot use 'in' operator to search for 'path' in undefined at Object.resolve (vue-router.mjs:3030:13) at ReactiveEffect.fn (vue-router.mjs:2169:41) at ReactiveEffect.run (reactivity.esm-bundler.js:178:19) at get value [as value] (reactivity.esm-bundler.js:1147:33) at useLink (vue-router.mjs:2212:30) at setup (vue-router.mjs:2258:31) at callWithErrorHandling (runtime-core.esm-bundler.js:158:18) at setupStatefulComponent (runtime-core.esm-bundler.js:7236:25) at setupComponent (runtime-core.esm-bundler.js:7197:36) at mountComponent (runtime-core.esm-bundler.js:5599:7)
07-17
这个错误信息是关于 Vue Router 的，在解析路由时出现了问题。具体错误信息是 "Cannot use 'in' operator to search for 'path' in undefined"，意味着在一个未定义的对象中使用了 'in' 运算符来搜索 'path' 属性。...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值