RangeError: Maximum call stack size exceeded

最新推荐文章于 2025-11-18 07:51:55 发布

原创最新推荐文章于 2025-11-18 07:51:55 发布 · 579 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#前端 #vue.js #javascript

Vue 3.0 同时被 2 个专栏收录

101 篇文章

订阅专栏

javascript

79 篇文章

订阅专栏

文章讲述了在Vue应用中遇到的一个错误，即RangeError:Maximumcallstacksizeexceeded，原因是父子组件的name相同以及在computed属性中使用了不规范的递归。作者通过排查代码，发现在computed中存在两个递归函数，并且这个问题只在项目打包上线后出现。为了解决问题，作者将这两个递归整合成一个，成功修复了线上问题。

问题

virtual_svg-icons-register.3650800b.js:5 RangeError: Maximum call stack size

问题分析

排查了一下，发现可能有几个原因：

父子组件的name相同，导致调用溢出
存在不符合规范的递归

代码分析

经过排查，锁定了在computed中调用了两个递归(奇怪的是在本地中没有问题，而打包到线上之后便有问题).

const menuList = computed(() => {
  if (!props.list.length) return []
  let list = parseList(props.list)
  list = filterIsLine(list)
  return list
})

处理

最终将两个递归整合一下，只写一个递归。打包、构建、测试。问题便解决了。