「Webpack configurator」は、webpackに関する設定を記述するwebpack.config.js
を各項目を選択するだけで出力してくれるジェネレータです。
React, CSS, Sass, SVG, lodashなど現状で10個の項目が用意されています。
サイトにアクセスするとページ上部に各項目のチェックボックスが並べられているので、そこから必要な機能を選択していきます。
各項目を選択するとその下の「Your personal webpack.config.js」にあるコード内容が変化していくので、あとはこの記述をコピーしてwebpack.config.js
にペーストするだけです。
選択できる機能としては、現時点で下記の10個が用意されています。
- React
- CSS
- sass
- less
- stylus
- SVG
- PNG
- moment
- lodash
- Production mode
また、コード出力箇所の横には各パッケージのインストールに必要なnpmのコマンドも出力されます。
何も選択していない場合はnpm install --save-dev webpack
が表示されていますが、例えば「React」と「sass」を選択した場合は下記のようにこれらのインストールコマンドも出力して、「React」選択時は.babelrc
に記述するコードも出力してくれます。
npm install --save-dev webpack style-loader css-loader sass-loader node-sass react react-dom babel-loader babel-preset-react babel-core babel-preset-env
実際にどうなるかはまだわかりませんが、今後も選択できる項目を追加する予定みたいですしOSSでPRも歓迎してるみたいなので、もっと便利なジェネレータにしたいという方がいればコンタクトを取ってみてください :)