BeetleJuice BeetleJuice - 26 days ago 11
TypeScript Question

Angular 2 Ahead-of-Time compiler: must I make all class properties public?

Angular 2 rc 6
,
typescript 2
,
node 4.5.0
,
npm 2.15.9
on
Windows 7


I'm trying to move from Just-in-Time to Ahead-of-Time compilation and I'm relying on these resources:



I understand that I need to run the compiler
ngc
to generate
ngfactory.ts
files, and that I need to change
main.ts
to use
platformBrowser
instead of
platformBrowserDynamic
to bootstrap. I've hit a roadblock though and don't know how to proceed.

1. I've confirmed that the App runs without errors using Just-in-Time compilation. My
main.ts
is:

enableProdMode();
platformBrowserDynamic().bootstrapModule(AppModule);


2. I clear all my app files from my production folder, but keep 3rd party libraries (eg: Angular 2, Angular 2 Material)

3. I run
"node_modules/.bin/ngc" -p ./
This runs with no output to the console. I see an
.ngfactory.ts
file for each of my
.ts
components and modules. I also see a
.css.shim.ts
file for each of my
.css
that held component styles. In addition,
.js
and
.js.map
files have been transpiled and placed in the production directory

4. If I try to run the app at this point, I see
404 not found
errors for all the
.html
files that held component templates

5. I manually move all template files (
.html
) to production dir and run the App. It runs fine, but it still uses Just-in-Time compilation (255 requests, including
compiler.umd.js
)

6. I change my
main.ts
to:

enableProdMode();
platformBrowser().bootstrapModuleFactory(AppModuleNgFactory);


On its own, this makes no difference since the new code has not been compiled. However, I don't know what to do from here.

Should I run
ngc
again? If so I get lots of errors of the type:

Error at C:/path/to/notify.component.ngfactory.ts:113:41: Property 'visible' is private and only accessible within class 'NotifyComponent'
... (many more like that with lots of properties from lots of components)
Compilation failed


Does using AoT compilation mean that I must make all my class properties public? Am I missing a step?

Answer

For a given component all its members (methods, properties) accessed by its template must be public in the ahead-of-time compilation scenario. This is due to the fact that a template is turned into a TS class. A generated class and a component are 2 separate classes now and you can't access private members cross-class.

In short: you can't access private members in your templates if you want to use ahead-of-time compilation.

Comments