Vue路由守卫死循环会触发RangeError而非OOM，因无限嵌套调用耗尽调用栈，表现为卡死、白屏、URL不变；根本原因是守卫未正确终结导航，须确保每个分支唯一调用next()且避免无条件重定向。
Vue 路由守卫死循环不会直接造成传统意义的“内存溢出（OOM）”，但会快速耗尽 JavaScript 调用栈，触发 RangeError: Maximum call stack size exceeded，表现为页面卡死、白屏、URL 不变、组件不渲染——这是导航流程在 beforeEach 中无限嵌套触发所致，本质是逻辑失控，而非堆内存持续增长。
关键：每次守卫必须有且仅有一次 next 调用
死循环根源在于守卫函数反复执行却始终无法“终结”当前导航。常见错误是无条件调用 next('/login')，导致跳转后再次进入同一守卫，形成自循环。
- 所有分支（
if、else、try/catch、异步await后）都必须显式调用next()、next(false)或next('/xxx') - 漏写
next()会导致页面白屏；多写或无条件重定向则引发死循环 - 异步逻辑中，
await后必须紧跟next，不能把next写在await外层或遗漏
防自循环：加路径判断再重定向
登录校验是最典型场景。若用户已位于 /login，却仍执行 next('/login')，就会触发循环。
Springboot Vue Builder
下载
从零开始编排 SpringBoot+Vue 全栈项目工作流，适用于新建全栈项目或完整脚手架请求，触发后依次调用 product‑spec‑builder（需求调研）等模块。
- 重定向前务必判断目标路径是否与当前
to.path相同：如if (to.path !== '/login') - 推荐使用
replace: true，避免历史记录堆积，防止用户点“返回”又回到空页或重复触发守卫 - 示例安全写法：
if (to.meta.needAuth && !token) {
if (to.path !== '/login') {
next({ path: '/login', replace: true });
} else {
next();
}
} else {
next();
}
防冗余跳转：避免相同路径二次导航
即使不是死循环，重复跳转到当前路由也会报 NavigationDuplicated 错误，虽不崩溃，但可能中断 Promise 链、干扰调试。
立即学习“前端免费学习笔记（深入）”；
- 在触发
router.push前，可简单比对to.path === $route.path && JSON.stringify(to.query) === JSON.stringify($route.query) - 菜单点击等用户操作中，建议加
v-if或禁用状态，避免高频重复点击触发多次push - 守卫内部不要基于
from.path做跳转决策（易误判），优先以to为准
辅助排查：快速定位守卫卡住
出现以下现象，基本可锁定为守卫逻辑问题：
- 点击菜单或输入 URL 后，页面长时间空白，
#app内无任何子节点 - 地址栏 URL 未变化，控制台无报错，网络请求也未发出
- 刷新页面能进，但通过内部跳转就卡住
- 加
console.time发现守卫函数执行 10+ 次仍未结束
