TrilonIO / aspnetcore-angular-universal

ASP.NET Core & Angular Universal advanced starter - PWA w/ server-side rendering for SEO, Bootstrap, i18n internationalization, TypeScript, unit testing, WebAPI REST setup, SignalR, Swagger docs, and more! By @TrilonIO
https://www.trilon.io
MIT License
1.46k stars 433 forks source link

AOT Published APP Generates 'Runtime Compiler Is not loaded' #385

Closed danielnajera closed 7 years ago

danielnajera commented 7 years ago

During development, it works fine but in production, I get these errors when running any HTTP GET, POST, PUT, DELETE.

ERROR Error: Uncaught (in promise): Error: Runtime compiler is not loaded _throwError@http://taamappsrv:8080/dist/main-browser.js:3510:11 Compiler.prototype.compileModuleAndAllComponentsAsync@http://taamappsrv:8080/dist/main-browser.js:3556:15 DynamicBase.prototype.ngOnChanges/<@http://taamappsrv:8080/dist/main-browser.js:57520:80 ZoneDelegate.prototype.invoke@http://taamappsrv:8080/dist/main-browser.js:120811:17 onInvoke@http://taamappsrv:8080/dist/main-browser.js:4429:24 ZoneDelegate.prototype.invoke@http://taamappsrv:8080/dist/main-browser.js:120810:17 Zone.prototype.run@http://taamappsrv:8080/dist/main-browser.js:120561:24 scheduleResolveOrReject/<@http://taamappsrv:8080/dist/main-browser.js:121251:52 ZoneDelegate.prototype.invokeTask@http://taamappsrv:8080/dist/main-browser.js:120844:17 onInvokeTask@http://taamappsrv:8080/dist/main-browser.js:4420:24 ZoneDelegate.prototype.invokeTask@http://taamappsrv:8080/dist/main-browser.js:120843:17 Zone.prototype.runTask@http://taamappsrv:8080/dist/main-browser.js:120611:28 drainMicroTaskQueue@http://taamappsrv:8080/dist/main-browser.js:121015:25 ZoneTask.invokeTask@http://taamappsrv:8080/dist/main-browser.js:120922:21 invokeTask@http://taamappsrv:8080/dist/main-browser.js:121790:9 globalZoneAwareCallback@http://taamappsrv:8080/dist/main-browser.js:121808:17

MarkPieszak commented 7 years ago

Are you using the Compiler class from angular/core someplace?

danielnajera commented 7 years ago

only here: /* ***** TEMPORARILY HERE **

MarkPieszak commented 7 years ago

That's very strange, it might be coming from some 3rd party module somehow... not sure where this came from. Was working just the other day! Will see what I can find

danielnajera commented 7 years ago

Here is another shot in from chrome

core.es5.js:1020 ERROR Error: Uncaught (in promise): Error: Runtime compiler is not loaded Error: Runtime compiler is not loaded at _throwError (core.es5.js:2971) at Compiler.compileModuleAndAllComponentsAsync (core.es5.js:3017) at DynamicBase.js:47 at ZoneDelegate.invoke (zone.js:391) at Object.onInvoke (core.es5.js:3890) at ZoneDelegate.invoke (zone.js:390) at Zone.run (zone.js:141) at zone.js:831 at ZoneDelegate.invokeTask (zone.js:424) at Object.onInvokeTask (core.es5.js:3881) at _throwError (core.es5.js:2971) at Compiler.compileModuleAndAllComponentsAsync (core.es5.js:3017) at DynamicBase.js:47 at ZoneDelegate.invoke (zone.js:391) at Object.onInvoke (core.es5.js:3890) at ZoneDelegate.invoke (zone.js:390) at Zone.run (zone.js:141) at zone.js:831 at ZoneDelegate.invokeTask (zone.js:424) at Object.onInvokeTask (core.es5.js:3881) at resolvePromise (zone.js:783) at zone.js:834 at ZoneDelegate.invokeTask (zone.js:424) at Object.onInvokeTask (core.es5.js:3881) at ZoneDelegate.invokeTask (zone.js:423) at Zone.runTask (zone.js:191) at drainMicroTaskQueue (zone.js:595) at ZoneTask.invokeTask [as invoke] (zone.js:502) at invokeTask (zone.js:1370) at HTMLFormElement.globalZoneAwareCallback (zone.js:1388)

danielnajera commented 7 years ago

To reproduce simply go to this url and try to login using any password and username, if you run F12 in console you will see the error

https://tsms.rtcsnv.com/Login

danielnajera commented 7 years ago

Thanks for the help.

MarkPieszak commented 7 years ago

So it looks like you're using some 3rd party library ngx-dynamic-component https://github.com/apoterenko/ngx-dynamic-template ? It looks like the library doesn't support AoT in their readme :(

We have a great write-up here on creating them dynamically: https://angular.io/guide/dynamic-component-loader check that out you'll be able to do whatever you need, and at least you'll have full-control over it now! :)

at Compiler.compileModuleAndAllComponentsAsync (core.es5.js:3017)
    at DynamicBase.js:47 <------ I could see here is where the error stems from
danielnajera commented 7 years ago

I found the problem, the library angular2-busy-aot is not aot compatible even though the name says so. It generates angular2-dynamic-component folder in the nodules folder. I used angular2-busy instead problems resolved. Thank you for all you do and your help.

MarkPieszak commented 7 years ago

Glad you got it working! 👍 👍