Skip to content

Vue-Router 2: Uncaught RangeError: Maximum call stack size exceeded

Yeasterday, I found my front-end Vuejs program printed error like this:

text
Uncaught RangeError: Maximum call stack size exceeded
    at def (eval at <anonymous> (app.js:650), <anonymous>:342:30)
    at new Observer (eval at <anonymous> (app.js:650), <anonymous>:673:3)
    at observe (eval at <anonymous> (app.js:650), <anonymous>:749:10)
    at initData (eval at <anonymous> (app.js:650), <anonymous>:3196:3)
    at initState (eval at <anonymous> (app.js:650), <anonymous>:3121:5)
    at VueComponent.Vue._init (eval at <anonymous> (app.js:650), <anonymous>:3378:5)
    at new VueComponent (eval at <anonymous> (app.js:650), <anonymous>:3500:12)
    at createComponentInstanceForVnode (eval at <anonymous> (app.js:650), <anonymous>:1724:10)
    at init (eval at <anonymous> (app.js:650), <anonymous>:1734:43)
    at createComponent (eval at <anonymous> (app.js:650), <anonymous>:4174:9)

I was quickly establishing the basic structure of my new project at that time, and so there were many details I ignored. When I found the above error information, I was shocked. WTF is it? After some attempts, I found the problem is that there were some Vuejs component named "RouterView" which has inside them, and that was the cause. After I renamed their router component to names other than "RouterView", the above error information disappeared.

天上的神明与星辰,人间的艺术和真纯,我们所敬畏和热爱的,莫过于此。