What are the reasons for adding angular postinstall "ngcc..." script in the project?

Question

Pardon if below question looks naive to you:

I've go through multiple project developed by angular 9 and most of them having below line in their package.json as posinstall script.

"postinstall": "ngcc --properties es2015 es5 browser module main --first-only --create-ivy-entry-points"

I read the angular documentation and as per my understanding We have added "ngcc" to validate the installed package is compatible with Ivy or not.

Also as per their recommendation, we should not use the "--create-ivy-entry-points" flag as this will cause Node not to resolve the Ivy version of the packages correctly.

Question: Could someone explain the reason for adding other flags and properties eg: "--properties es2015 es5 browser module main --first-only --create-ivy-entry-points" after ngcc in post install script.

Thanks in advance!

Answer 1

Actually, ngcc's job isn't package validation. It takes non-Ivy libraries and generates files which Ivy understands. I believe Ivy instructions generated by ngtsc (besides not being backwards compatible with ngc generated code) aren't stable yet, so the rule for now is to keep using View Engine - ngc for libraries. That's how ngcc fits into the picture, processing libraries with View Engine code.

About the question, ngcc's source has documentation for each of them:

• If no properties flag is given, ngcc will process all package formats (fesm2015, fesm5, es2015, esm2015, esm5, main, module), which may not be what's desired.
• The flag first-only tells ngcc to process the first property it finds in package.json, otherwise it'll process all entries listed above.
• The create-ivy-entry-points will tell ngcc to create new properties for the Ivy generated entry, instead of overwriting the previous one.

I think some people use postinstall for flow optimization. I'm actually adding it in my work's Angular app in order to cache the Ivy-ready node_modules in our CI pipeline.