nuxt框架偶发报错Loading chunk {n} failed

最近在维护公司项目中的website网站时,发现刷新加载页面时js或css资源会偶发性地出现以下图片报错。该项目是基于nuxt框架搭建的SSR服务器预渲染。

于是我思考是不是因为网速慢异步加载导致的报错,我将网速调整成3g网络刷新试验,结果并没有预料中频发。于是我又尝试将项目中的link标签引用的一些css、js文件中异步引用的文件直接打包成一个文件,重新发布后测试仍会偶发。

会是哪里出问题了呢?去nuxt社区瞧瞧。

找到了一个遇到同样问题的人,这个人2017年就遇到了这个报错并向作者提出。作者答复没啥实际的帮助。

后来随着遇到这个问题的开发者越来越多,有的开发者fork代码并通过一条折中的办法来解决这个偶现的报错:如果出现了这个报错就刷新页面,直到页面正常(nuxt#3389)。

遗憾的是这个折中的办法,仍不能完全解决问题,刷新页面可能会带来状态的丢失,如果刷新后页面仍旧报错那么页面则会陷入死循环。

到现在,在nuxt 2.14.7 这个问题到现在仍然发生,据作者说在nuxt 2.4.0 版本中会解决这个问题。

我会继续关注这个报错在社区的处理结果,如果大家有遇到或者有办法解决这个偶现报错,欢迎在nuxt#3389讨论。

 


2021年6月16日补充

目前项目没有再发生报错的情况了,我做了两件事情:

1、在报错组件中加上了如下代码:

  mounted() {
    if (this.error.message && window.location.hash !== '#retry') {
      window.location.hash = '#retry'
      window.location.reload(true)
    }
  },

如果有报错的情况则重新刷新页面,并加hash,阻止循环刷新。

2、组件注册中,阻止服务端重复注册组件,防止内存泄漏:

具体我在这篇博客中记录了:nuxt.js之SSR服务端内存泄漏导致CPU过高的解决过程

  • 3
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 2
    评论

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值