Angular single-spa lazy loaded routes in lazy loaded modules give call of undefined webpack error

Question

I use single-spa with angular. I have a shell and a sub application, when my subapplication has lazy loaded modules so RootModule which loads SubModule Which loads SuperSubModule. All of these routes are lazy loaded routes. This works fine when i serve my application without single-spa and the single-spa webpack config. But when I build my application in production mode and aot, the lazy loaded route SubModule to SuperSubModule gives an error when i navigate to that url. The error is:

ERROR Error: Uncaught (in promise): TypeError: Cannot read property 'call' of undefined TypeError: Cannot read property 'call' of undefined at o (bootstrap:63) at ZoneDelegate.invoke (zone.js:396) at Object.onInvoke (main.js:1) at ZoneDelegate.invoke (zone.js:395) at Object.onInvoke (core.js:39699) at ZoneDelegate.invoke (zone.js:395) at Zone.run (zone.js:153) at zone.js:894 at ZoneDelegate.invokeTask (zone.js:431) at Object.onInvokeTask (main.js:1) at resolvePromise (zone.js:836) at resolvePromise (zone.js:795) at zone.js:897 at ZoneDelegate.invokeTask (zone.js:431) at Object.onInvokeTask (main.js:1) at ZoneDelegate.invokeTask (zone.js:430) at Object.onInvokeTask (core.js:39680) at ZoneDelegate.invokeTask (zone.js:430) at Zone.runTask (zone.js:198) at drainMicroTaskQueue (zone.js:611)

When i click the url to that module again the error is: ERROR Error: Uncaught (in promise): Error: No NgModule metadata found for 'undefined'.

Error: No NgModule metadata found for 'undefined'. at lg.resolve (compiler.js:20900) at Th.getNgModuleMetadata (compiler.js:20029) at Jg._loadModules (compiler.js:25824) at Jg._compileModuleAndComponents (compiler.js:25807) at Jg.compileModuleAsync (compiler.js:25769) at useClass.compileModuleAsync (platform-browser-dynamic.js:223) at c.project (router.js:6406) at c._tryNext (mergeMap.js:46) at c._next (mergeMap.js:36) at c.next (Subscriber.js:50) at resolvePromise (zone.js:836) at resolvePromise (zone.js:795) at zone.js:897 at ZoneDelegate.invokeTask (zone.js:431) at Object.onInvokeTask (main.js:1) at ZoneDelegate.invokeTask (zone.js:430) at Object.onInvokeTask (core.js:39680) at ZoneDelegate.invokeTask (zone.js:430) at Zone.runTask (zone.js:198) at drainMicroTaskQueue (zone.js:611)

Does anybody have any idea how to fix this? Any feedback is welcome, I have been stuck at this problem for days now. Thanks in advance! Edit: This only happens in production mode and when single-spa is used, not when served standalone in production mode.

Answer 1

答案在 single-spa 的常见问题解答中： https : //single-spa.js.org/docs/faq/#code-splits您必须执行解决方案 1 和 2 才能使其工作，在我们的情况下，2 错过了。