javascript - RangeError: Maximum call stack size in production only

Question

In my Angular 10 app I'm getting following warning in production which I cannot reproduce locally:

main-es2015.f525fab5b0fb3ab34ccf.js:1 RangeError: Maximum call stack size exceeded
    at c.unsubscribe (main-es2015.f525fab5b0fb3ab34ccf.js:1)
    at c._unsubscribeAndRecycle (main-es2015.f525fab5b0fb3ab34ccf.js:1)
    at c.error (main-es2015.f525fab5b0fb3ab34ccf.js:5)
    at u._trySubscribe (main-es2015.f525fab5b0fb3ab34ccf.js:5)
    at u._trySubscribe (main-es2015.f525fab5b0fb3ab34ccf.js:130)
    at u.subscribe (main-es2015.f525fab5b0fb3ab34ccf.js:5)
    at t._subscribe (main-es2015.f525fab5b0fb3ab34ccf.js:5)
    at t.subscribe (main-es2015.f525fab5b0fb3ab34ccf.js:5)
    at c.notifyNext (main-es2015.f525fab5b0fb3ab34ccf.js:5)
    at r._next (main-es2015.f525fab5b0fb3ab34ccf.js:1)

The problem occurs after navigating to one of the routes, so I guess it's related to lazy loading. I know that this would indicate that I have infinite loops or circular dependency, but the problem is that it works just fine locally. And what I mean by that is running the app in dev or compiling in prod mode and running compiled files using express server (just like I do it in production) do not throw any errors or warnings.

I use node v. 12.16.1 and npm v. 6.13.4 both in prod and dev environment. I would appreciate any tips on how to debug or recreate the error on my machine.

question from:https://stackoverflow.com/questions/66064258/rangeerror-maximum-call-stack-size-in-production-only

Answer 1

Ok, I was able to fix it. The problem was caused by retryWhen RxJS operator. I didn't have my websocket service URI set on Heroku in config vars, so the operator got into infinite loop causing maximum call stack size error.