前回は、最小構成でのWebpackの利用を学びました。
今回はWebpackチュートリアルの第３回目。プラグインの使用について学びます。
プラグインの使用
今回はファイルを圧縮するUgilifyJSPluginを使用します。
configファイルは以下のようになります。
pluginsという要素が新しく登場しましたが、これは使用するプラグインを格納する配列です。
また、今回はUgilifyJSPluginを用いましたが、他にはOrderOccurencePluginのようなプラグインもあります。モジュールに振るIDを、モジュールの登場頻度にそって振ってくれるとか。
ちなみに、このプラグインはWebpack2ではデフォルトで内包されるようです。なのでWebpack1でもその仕様に従うならば、configファイルは以下のようになります。
バンドル比較
蛇足ではありますが、生成されたバンドルファイルの比較をしておきます。
こちらが非圧縮。
こちらが圧縮済み。
まとめ
というわけで、プラグインを導入する方法を学びました。
基本的にはconfigに書けばOKですね。あとは、各プラグインの用法をその都度学んでいく感じですね。
今回作成したファイルはこちらから。
