調査のためだけにAngular Template Compilerを使用しようとしています。初期段階であることはわかっていますが、RC5のドキュメントでは既に言及されています。小さな「hello, world」プロジェクトを作成して実行できますが、ファイルngcは生成され.ngFactory.tsず、ファイルしか表示されません.metadata.json。

angular 2 クイックスタートを複製することで確認できます。実行$(npm bin)/tscは正常に機能し、「app」ディレクトリの typescript をマップ ファイルを含む javascript にコンパイルします。

次に、指示に従い、ノード モジュールをインストールしました (typescript のアップグレード)。

現在も動作し、ファイル$(npm bin)/tscが生成されます。これらのファイルを削除して実行すると、とファイルが生成され、次の2 つの新しいファイルが生成されます。.js.js.map$(npm bin)/ngc.js.js.map

これらのファイルには、基本的にデコレーターからのメタデータが含まれているようです。

しかしngc、コンソールへの出力は生成されず、ngFactoryそこにあるはずのファイルも表示されません。もともと typescript@next は 2.1.0-dev.20160813 を提供し、パッケージは 1.9.0 を期待する満たされていないピア依存関係を示しているため、1.9.0-dev.20160627-1.0 をインストールしますが、同じ結果が得られます。また、core-js の型 (Promise、Set、Map など) が見つからないため、どちらが$(npm bin)/ngc -p .同じことを行い、多くのエラーが発生するかを試しました。$(npm bin)/ngc -p app

angular cliでAOTを使用する方法はありますか?

モジュール (@angular/compiler @angular/compiler-cli) をインストールしました。 ngc -p scr と入力すると、ngFactory.ts ファイルが作成され、dist/tsc-out にコンパイルされます (tsconfig の角度 cli デフォルト)。

ここから先に進む方法がわからない:)

乾杯

ハン

Angular 2Ahead-of-Time コンパイルの使用をもう一度試してみたいと思います。

現在のセットアップでは変更が必要なカスタム ビルド プロセスを使用しているため、これにはかなりのリファクタリングが必要になります。

開始する前に知っておく必要があります:メタデータ.scss内の外部ファイルにリンクする場合styleUrls、AoT コンパイラは機能しますか?

または、最初にすべてのスタイルを CSS スタイルシートに変換して.cssリンクする必要がありますか?

readmeではこれについて説明していません。

グローバルにインストールし@angular/compiler-cli、次のtsconfig-aot.jsonをクライアント ディレクトリに追加しました。

angular docs で推奨されているとおり。次にngc -p tsconfig-aot.json、クライアント ディレクトリで実行しますが、次のエラーが発生します。

エラー: コンパイルに失敗しました。リソース ファイルが見つかりません: C:/Users/George/Source/Repos/docs/client/components/home/client/components/home/home.html

そのリソースがないため.. 私の home.html は にありC:/Users/George/Source/Repos/docs/client/components/home/home.htmlます。

AoT を使用して ViewChild が見つからない

1. サードパーティの libサポートAoTを取得した後、コンパイル時にエラーなしでコンパイルに成功しましngcた!
2. このサードパーティのライブラリをプロジェクトに挿入するため、プロジェクトは--aotフラグを使用して CLI でコンパイルされ、コンパイル中にエラーは発生しませんが、ナビゲーターでアプリを開くと、次のようになります。

ReferenceError: nameColumnHeader が定義されていません

3. これnameColumnHeaderはViewChild()デコレータです:

@ViewChild('nameColumnHeader') nameColumnHeader: TemplateRef<any>;

もちろん、私は<template #nameColumnHeader...>内部HTMLを持っています。この ViewChild を削除すると、別の問題が発生します #material2/sidenav コンポーネントの終了 ...

何が問題なのかわかりません。ちなみに、プロジェクトでng serve --prod --aotを実行したときに何が問題なのかcliが教えてくれないのはなぜですか!!!

AoT を使用してより大きな main.js をバンドルする

私はすべてのViewChild()再コンパイルを削除し--aot、ページは正しく表示されますが、main.js のサイズを
使用してコンパイルすると1836 Koになり、AoT でコンパイルすると main.jsのサイズは : 1860Koになります。ng build --prodng build --prod --aot

役に立つ場合

• 私のapp.module.tsをチェックしてください
• 私のpackage.jsonをチェックしてください
• 私のtsconfig.jsonをチェックしてください

アップデート：

ViewChild を使用するときは、セミコロンを使用する必要があります!!! AOTなしでコンパイルするときにセミコロンなしでViewChildを書くことができるのは奇妙ですが、AoTではセミコロンが必要です