Search code examples
angularrollupangular2-aotaot

Angular AoT and Rollup - Error: Runtime compiler is not loaded

I have a been building a dashboard application using Angular for the last 6 months in that time I have had a really nice development workflow using JiT compilation and gulp browser sync to get instant updates when I make changes. Which has worked great.

I have come to the point where I am happy to deploy a production version, however, I have run into issues with AoT and rollup.

I have followed the angular.io guide but got the following

ERROR Error: Uncaught (in promise): Error: Runtime compiler is not loaded
Error: Runtime compiler is not loaded
    at _throwError (build.js:5036)
    at Compiler.compileModuleAsync (build.js:5065)
    at MergeMapSubscriber.project (build.js:34798)
    at MergeMapSubscriber._tryNext (build.js:30450)
    at MergeMapSubscriber._next (build.js:30440)
    at MergeMapSubscriber.Subscriber.next (build.js:425)
    at ScalarObservable._subscribe (build.js:846)
    at ScalarObservable.Observable._trySubscribe (build.js:708)
    at ScalarObservable.Observable.subscribe (build.js:696)
    at MergeMapOperator.call (build.js:30415)
    at _throwError (build.js:5036)
    at Compiler.compileModuleAsync (build.js:5065)
    at MergeMapSubscriber.project (build.js:34798)
    at MergeMapSubscriber._tryNext (build.js:30450)
    at MergeMapSubscriber._next (build.js:30440)
    at MergeMapSubscriber.Subscriber.next (build.js:425)
    at ScalarObservable._subscribe (build.js:846)
    at ScalarObservable.Observable._trySubscribe (build.js:708)
    at ScalarObservable.Observable.subscribe (build.js:696)
    at MergeMapOperator.call (build.js:30415)
    at resolvePromise (zone.js:769)
    at resolvePromise (zone.js:740)
    at zone.js:817
    at ZoneDelegate.invokeTask (zone.js:424)
    at Object.onInvokeTask (build.js:6048)
    at ZoneDelegate.invokeTask (zone.js:423)
    at Zone.runTask (zone.js:191)
    at drainMicroTaskQueue (zone.js:584)
    at ZoneTask.invoke (zone.js:490)

I am also using a number of different angular plugins that could be causing the issue (however I couldn't find any reference to an AoT issue) namely MyDatePicker and MyDateRangePicker. I also have a couple of js libraries including D3.js and momement.js

So my question is, is there somthing that I am doing wrong that is causing my build.js file to throw runtime compiler is not loading?

If anyone has any insight into the issue it would be greatly appreciated if you require any specific code snippets let me know, as I mentioned my tsconfig-aot.json and rollup-config.json is essentially the same as in angular.io

Thanks in advance

Solution

  • Big thanks to yurzui in the comments for helping me answer my own question.

    The approach that helped me find where the runtime compiler was being loaded in was to go into my generated build.js and finding the use of compileModuleAsync. I found it within the loadChildren method, after removing its use the project ran successfully in the browser.

    However, I am not sure as to why loadChildren is causing the compiler to load in on rollup.

    Hope this helps.