Edited at

gulp.js その4 プラグイン一覧

More than 3 years have passed since last update.

gulpで使うプラグインやnpmモジュールをピックアップ


更新履歴


  • 2016-03-11 更新

  • 2014-07-25 gulp-bower-files がdeprecateされていた。代替は main-bower-files

  • 2014-07-24 gulp-connect がdeprecateされた。代替は後継の gulp-webserver

  • 2014-06-29 gulp-clean の箇所を修正(shinnn様にご指摘いただきました。感謝!m(_ _)m)


プラグイン

今は使わない方が良いプラグインリスト - gulpjs/plugins - github

↑要チェック。この記事には未反映


Webサーバー、ユーティリティ


ストリーム操作



  • gulp-changed 前回のgulp実行から変更したファイルだけをフィルタリング


  • gulp-cached 処理したファイルをキャッシュ。次回実行時、変更のないファイルは後のストリームに流れない


  • gulp-remember タスクのストリームに流れたファイル群を記憶。上のgulp-cachedでストリームから外されたファイルを対象に復帰させる


  • gulp-newer passing through only those source files that are newer than corresponding destination files.


  • gulp-if 分岐処理。条件に当てはまればタスクを実行


  • gulp-filter 型グロブでフィルタリング。例えば引数に '*/.js' を指定して以降のストリームにJavaScriptファイルのみ流したい場合などに使用


タスク



  • run-sequence タスクを任意の順番で実行(同期的に)


ファイル操作



  • gulp-bower-files ※deprecateされた。代替は下の main-bower-files


  • main-bower-files bower.json の main に書かれたファイルを取得。mainが書かれていなかったり、意図したものと異なる場合はオプションでオーバーライドする(»設定参考)


  • gulp-flatten ファイルのパス階層を無くす


  • gulp-rename ファイルのリネーム


  • gulp-concat 複数のファイルを1つに結合


FTP、SFTP



  • gulp-ftp FTPサーバーにアップロード


  • gulp-sftp SFTPサーバーにアップロード。鍵はデフォルトで ~/.ssh/id_dsa と /.ssh/id_rsa を探す。オプションで変更可


画像


圧縮・解凍


HTML


CSS



  • gulp-sass Sass/SCSSのコンパイル。常に圧縮されるのでsourcemap使えない


  • gulp-ruby-sass 同上。sourcemap使えてオプション多い。自分は使うならこっち


  • gulp-less LESSのコンパイル


  • gulp-stylus Stylusのコンパイル


  • gulp-pleeease 下記[A][B][C]、フォールバック(CSS変数, 擬似要素の繋ぎ :: を : に,rem指定ならpx指定追加) 、CSS shorthand filtersにSVG変換したものを追加などの機能が統合 »pleeese


  • gulp-autoprefixer [A]ベンダープリフィックスの整理(*指定でエラーが出るらしい


  • gulp-combine-media-queries [B]メディアクエリを整理・統合。メディアクエリ部分に移動時、同じセレクタを統合してくれないのは不満


  • gulp-csscomb CSSプロパティ並び順整理


  • gulp-csslint CSS構文チェック


  • gulp-minify-css [C]CSS圧縮


JavaScript用


変換


その他


  • HTMLからJade,markdown,プレーンテキストに変換(gulp-html2xxxx)

  • ファイル書き出し

  • 文字コード変換

  • DataURI化(gulp-base64,gulp-css-base64,gulp-data-uri)

  • JSON,YAML,XML,PLIST,CSV の相互変換(gulp-convert,gulp-csv2json,gulp-xml2json)

  • Angular関連


人気なので後で確認


参考記事