Angular2 WebPackデバッグ用のバンドルには永遠にかかります

Question

Angular2 CLIを使用してプロジェクトの足場を作成しました。それはWebpackを使用します。私が開発をしているときに、私が変更を加えてそれを保存するたびに、Webpackはバンドルを再作成してから、ページをリロードして変更を確認する必要があります。実際はわずか10〜12秒ですが、デバッグにはこれはまあまあです。時々、ページをバンドルしてリロードするのに、変更を加えるよりも4倍の時間がかかります。それは怒っている。 何か間違っていますか？私はAngular CLIやWebpackの設定を変更していないので、どこから始めるべきか分からないでしょう。私のプロジェクトはまだ（まだ）大きくはありません - それまでの5-6の単純なコンポーネントです。

アイデア？

おかげで、

デイブ

Answer 1

これは、ビルドビットを助けるあなたのWebPACKの設定でこれを追加することができ、

cache: true, 
    devtool: 'cheap-module-source-map', 

もこれをチェック：開発中のWebPACKをスピードアップするためのhttps://webpack.github.io/docs/build-performance.html

Answer 2

2つのオプションが。

1. Webpack DLLを使用してライブラリを事前ビルドできます。これは、基本的には、javadriptファイル（vendor.ts）に事前ビルドしたいモジュールのリストを指定して、それらのモジュールを何度も繰り返しビルドするのではなく、次にwebpackをビルドするときに自動的に使用されるJSファイルを生成します。

2. HMR（ホットモジュールリロード）を使用できます。これは、webpackを一度実行することができることを意味し、ソースファイル（javascript/html/CSS/LESS/etc）のいずれかを将来変更するのを待つことになります。 Saveを押すと、webpack-dev-serverはあなたがファイルを変更したことを検知し、そのファイルを1つだけビルドし、自動的にソケットを使ってブラウザに転送します。ブラウザはその1つのモジュールとそれに依存するモジュール。同じアプリ状態を維持することもできるので、ブラウザを更新する必要はなく、ブラウザの状態は保存前に中断していた場所から継続されます。