Angular - AOT Compilation ng vs ngc

Question

What is different between AOT with ngc and rollup

ngc -p tsconfig-aot.json && rollup -c rollup-config.js

https://angular.io/guide/aot-compiler#aot-quickstart-source-code

and AOT with Angular CLI

ng build --aot

https://github.com/angular/angular-cli/wiki/build

both configuration is very different, which one is better or prefer.

Answer 1

When you run:

ngc -p tsconfig-aot.json

Angular runs AOT compiler against your files and produces a set of compiled files. These files contain compiled factories for components and modules and are not bundled in any way. In order to be loaded into a browser they need to be bundled. And so this command:

rollup -c rollup-config.js

bundles them together into one bundle using rollup. The && simply chains two commands.

When you run ng build --aot just as in the first case it runs AOT compiler against your files but instead of simply outputting them this compilation is part of webpack bundling process. So the output is a webpack bundle.

which one is better or prefer.

Since the general recommendation is to use webpack for applications and rollup for libraries, use the first configuration if you're building a library and the second for an application.