Web制作のありとあらゆる処理を自動化してくれるgulpの最近の設定を書いてみました。

そもそもgulpって?

gulpはいわゆるタスクランナーです。あらゆる処理を自動化してくれます。 例えばscssファイルをコンパイルしたり、コンパイルしてできたcssファイルを圧縮してくれたり、画像ファイル一式を圧縮してくれたり、jsファイルを圧縮してくれたり、ftpにアップロードしてくれたり、gitでcommit&pushしてくれたり、cssやjsのドキュメントを作成してくれたり、html/php/js/scssあたりが更新されたらブラウザのリロードをやってくれたり…数え上げたらキリがありません。一度使い始めるともう手放せません。

gulpのインストール

そもそもgulpをインストールしていない人は何も考えないでQiitaの記事に上げたシェルスクリプトをダウンロードしてきて実行してください。とりあえず全部インストールできます。

gulpfile.js

JavaScriptがある程度わかってると理解するのは簡単だと思います。 gulpはgulpfile.jsというファイルでプラグインを読み込んでタスクを登録しますが、ここでは最近使ってるgulpfile.jsを載せておきます。