devboosts/dynamic-component-loader

preloadingStrategy - Maximum call stack size exceeded

Closed this issue · 2 comments

dottodot commented

Thanks for the article and code.

I've tried using this in my own project but it seems to break the normal router when using preloadingStrategy.

Can you think of any way this could be overcome?

core.js:1440 ERROR Error: Uncaught (in promise): RangeError: Maximum call stack size exceeded
RangeError: Maximum call stack size exceeded
    at mergeMapOperatorFunction (mergeMap.js:74)
    at ArrayObservable.mergeAll (mergeAll.js:51)
    at RouterPreloader.processRoutes (router.js:6892)
    at RouterPreloader.processRoutes (router.js:6889)
    at RouterPreloader.processRoutes (router.js:6881)
    at RouterPreloader.processRoutes (router.js:6881)
    at RouterPreloader.processRoutes (router.js:6881)
    at RouterPreloader.processRoutes (router.js:6881)
    at RouterPreloader.processRoutes (router.js:6881)
    at RouterPreloader.processRoutes (router.js:6881)
    at mergeMapOperatorFunction (mergeMap.js:74)
    at ArrayObservable.mergeAll (mergeAll.js:51)
    at RouterPreloader.processRoutes (router.js:6892)
    at RouterPreloader.processRoutes (router.js:6889)
    at RouterPreloader.processRoutes (router.js:6881)
    at RouterPreloader.processRoutes (router.js:6881)
    at RouterPreloader.processRoutes (router.js:6881)
    at RouterPreloader.processRoutes (router.js:6881)
    at RouterPreloader.processRoutes (router.js:6881)
    at RouterPreloader.processRoutes (router.js:6881)
    at resolvePromise (zone.js:809)
    at eval (zone.js:861)
    at ZoneDelegate.invokeTask (zone.js:421)
    at Object.onInvokeTask (core.js:4724)
    at ZoneDelegate.invokeTask (zone.js:420)
    at Zone.runTask (zone.js:188)
    at drainMicroTaskQueue (zone.js:595)
    at ZoneTask.invokeTask [as invoke] (zone.js:500)
    at invokeTask (zone.js:1517)
    at HTMLAnchorElement.globalZoneAwareCallback (zone.js:1543)
zbream commented

Ooh, that is an issue.

It turns out that when the router loads a module (for routing or otherwise), it reads the ROUTES token of that module, through its injector. However, if that module does not have its own ROUTES value provided, the recursive function that performs this work gets caught in an infinite loop of reading the root AppModule's ROUTES array.

The solution is to, in the dynamic module (MessageModule), provide the following:

{ provide: ROUTES, useValue: [] }

This won't affect anything in the way the project works (since there's no actual routing being done in that module), but will stop this issue from occurring.

Let me know if that works for you!

dottodot commented

Yes that works, thanks for that.

  • 🎉1