web-dev-qa-db-ja.com

Angular 2 Ahead-of-Timeコンパイラ：すべてのクラスプロパティをパブリックにする必要がありますか？

Angular 2 rc 6、TypeScript 2、node 4.5.0、npm 2.15.9、Windows 7

Just-in-TimeコンパイルからAhead-of-Timeコンパイルに移行しようとしています。これらのリソースに依存しています。

ngfactory.tsファイルを生成するためにコンパイラngcを実行する必要があることと、platformBrowserではなくplatformBrowserDynamicを使用するようにmain.tsを変更してブートストラップする必要があることを理解しています。でも私は障害物にぶつかったし、どうすればいいのかわからない。

1。ジャストインタイムコンパイルを使用して、アプリがエラーなしで実行されることを確認しました。私のmain.tsは：

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

2。私はすべてのアプリファイルをプロダクションフォルダーから消去しますが、サードパーティのライブラリは保持します（例：Angular 2 、Angular 2マテリアル）

3。私は"node_modules/.bin/ngc" -p ./を実行します。これは、コンソールへの出力なしで実行されます。 .ngfactory.tsコンポーネントとモジュールごとに.tsファイルが表示されます。また、コンポーネントスタイルを保持している.css.shim.tsごとに.cssファイルが表示されます。さらに、.jsおよび.js.mapファイルが変換され、運用ディレクトリに配置されています

4。この時点でアプリを実行しようとすると、保持していたすべての404 not foundファイルについて.htmlエラーが表示されますコンポーネントテンプレート

5。すべてのテンプレートファイル（.html）を手動で製品ディレクトリに移動し、アプリを実行します。正常に動作しますが、それでもジャストインタイムコンパイルが使用されます（255リクエスト、compiler.umd.jsを含む）

6。main.tsを次のように変更します：

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

新しいコードがコンパイルされていないため、それ自体は違いはありません。しかし、私はここから何をすべきかわかりません。

ngcをもう一度実行する必要がありますか？もしそうなら、私はタイプの多くのエラーを受け取ります：

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

AoTコンパイルを使用すると、すべてのクラスプロパティをパブリックにする必要がありますか？足りない？

angulartypescriptdeploymentnpmangular2-aot
20
BeetleJuice

特定のコンポーネントについて、テンプレートによってアクセスされるすべてのメンバー（メソッド、プロパティ）mustは、事前コンパイルシナリオでパブリックである必要があります。これは、テンプレートがTSクラスに変換されるためです。生成されたクラスとコンポーネントは2つの別個のクラスになり、クロスクラスのプライベートメンバーにアクセスできなくなりました。

つまり、事前コンパイルを使用する場合は、テンプレートのプライベートメンバーにアクセスできません。

36
pkozlowski.opensource

Angular 2 whit Ionic2 RC1の最終リリースでも同様です。

フィールドの回避策は、セッターなしでゲッターを使用することです

protected _myField: any;

get myField(): any { 
  return this._myField; 
}

また、JiTからAoTへのその他の考慮事項を参照して、コードを Isaac Mannのこのブログ に適合させることもできます。

  1. const lambda =>エクスポート関数
  2. デフォルトのエクスポート=>名前付きエクスポート
  3. テンプレートからアクセスするメンバーについては、プライベートな保護されたアクセサーをパブリックに変更する必要があります
  4. 動的コンポーネントテンプレート=>静的テンプレート
  5. moduleIdは、templateUrlを使用してコンポーネントに設定する必要があります
4
JavierFuentes