非公式Webpackチュートリアルその１ - コンパイラかく語りき

今日からWebpackのチュートリアルを何回かに分けて消化していきます。

消化するのはこちらのチュートリアル。

公式ではなく、有志によるチュートリアルです。

主にBabelやES2015をガリガリ使っていく前提で書かれているので、かなり有用なチュートリアルだと思われます。

それとなく意訳しつつ、自分のローカル環境でもチュートリアルの内容を再現していこうと思います。

まずはWebpackのモジュールバンドラとローダーとしての側面を見ていきましょう。

最初は単一のエントリーポイントを設定して作業していきます。

index.jsというファイルをエントリーポイントとして、必要なモジュールをrequireします。

index.jsがrequireするモジュールは以下のとおりです。

バンドルは以下のコマンドで実行します。

$ webpack -c index.js bundle.js

その結果、モジュールがバンドルされたbundle.jsというファイルが生成されます。

以上、一番最初のシンプルな例でした。

今回作成したレポジトリはこちら。

消化したチュートリアルがこちらでした。