[Grunt & Yeoman] Grunt: 落ち穂拾い
Grunt, Gruntfile まわりで参考にさせて頂いたソースや、気になったプラグインなどまとめ。
[markdown]
## Gruntfile の書き方
Yeoman を参考にするのが王道のよう。
> * [Yeoman – Modern workflows for modern webapps](http://yeoman.io/)
> * [Yeoman: フロントエンド開発のワークフローを提供するツール | deadwood](https://www.d-wood.com/blog/2014/02/12_5469.html)
個人的には、Gruntfile を公開・解説されている方のエントリが大変参考になりました。
> * [MY GRUNTFILE](http://mygrunt.kageya.ma/)
> * [Gruntfileを整理してタスクの自動化を進めた ::ハブろぐ](http://havelog.ayumusato.com/develop/javascript/e514-grunt_arrange_task.html)
> * [ahomu/grunt-sandbox](https://github.com/ahomu/grunt-sandbox)
> * [自分専用の Boilerplate を作ってみた | blog.makitasako.com](http://blog.makitasako.com/posts/2013-05-28-myproject/)
> * [ぼくがかんがえたさいきょうのGruntfileを晒してみる – Qiita [キータ]](http://qiita.com/masamunet/items/34022da57e2143d9084a)
> * [Gruntfile.cofee](https://gist.github.com/shuuheyhey/6728126)
> * [grunt-init-static-website/root/Gruntfile.coffee at master · sonicjam/grunt-init-static-website](https://github.com/sonicjam/grunt-init-static-website/blob/master/root/Gruntfile.coffee)
> * [オレオレGruntfile.js | spec5zigen Creator's Lab.](http://lab.spec5zigen.com/archives/mygruntfile-js/)
> * [オリジナルビルド環境をGrunt 0.4.xへ移行|Blog|Skyward Design](http://www.skyward-design.net/blog/archives/000159.html)
grunt だけでなく、.scss ファイルのレイアウトなど、参考にしながら勉強していきたい。
> * [ぼくのかんがえたさいきょうのしーえしゅえしゅ — MOL](http://t32k.me/mol/log/the-perfect-css-i-thought/)
> * [オリジナルテンプレート・ビルド環境2013年版の作成メモ|Blog|Skyward Design](http://www.skyward-design.net/blog/archives/000155.html)
## grunt-contrib
基本的なタスクはこれだけでまかなえる、公式プラグイン達。
さわれていないものもいくつかある。
### grunt-contrib-clean
Clean files and folders.
### grunt-contrib-coffee
Compile CoffeeScript files to JavaScript.
こちらは CoffeeScript のコンパイル。
後述のプラグインも含め、JavaScriptのテスト系がよく分からない。
> * [Mochaを使ってJavaScriptのテストをブラウザで実行してみよう (1/3):CodeZine](http://codezine.jp/article/detail/7367)
> * [Mocha + Chai で CoffeeScript を Grunt で自動テスト – Qiita [キータ]](http://qiita.com/astronaughts/items/483e04ac27bf8edde210)
### grunt-contrib-compass
Compile Sass to CSS using Compass
> * [Grunt: Compass のコンパイルと監視を行う](https://www.d-wood.com/wpmt/wp-admin/post.php?post=5027&action=edit)
### grunt-contrib-compress
Compress files and folders.
> * [Grunt: JavaScript や CSS を gzip する](https://www.d-wood.com/wpmt/wp-admin/post.php?post=5071&action=edit)
### grunt-contrib-concat
Concatenate files.
> * [Grunt: ファイルを結合する](https://www.d-wood.com/wpmt/wp-admin/post.php?post=5250&action=edit)
### grunt-contrib-connect
Start a connect web server.
> * [Grunt: サーバを立ててLiveReload をつかう](https://www.d-wood.com/wpmt/wp-admin/post.php?post=5033&action=edit)
### grunt-contrib-copy
Copy files and folders.
> * [Grunt: ファイルをコピーする](https://www.d-wood.com/wpmt/wp-admin/post.php?post=5248&action=edit)
### grunt-contrib-cssmin
Compress CSS files.
> * [Grunt: css ファイルの結合・圧縮をする](https://www.d-wood.com/wpmt/wp-admin/post.php?post=5065&action=edit)
### grunt-contrib-csslint
Lint CSS files.
> * [Grunt: css/js と lint/hint](https://www.d-wood.com/wpmt/wp-admin/post.php?post=5042&action=edit)
### grunt-contrib-handlebars
Precompile Handlebars templates to JST file.
### grunt-contrib-htmlmin
Minify HTML
### grunt-contrib-imagemin
Minify PNG, JPEG and GIF images
> * [Grunt: png, jpg, gif を圧縮する](https://www.d-wood.com/wpmt/wp-admin/post.php?post=5068&action=edit)
### grunt-contrib-jade
Compile Jade templates.
ざっくり調べた感触ではよく見かけました。
他には slim とか。
### grunt-contrib-jasmine
Run jasmine specs headlessly through PhantomJS.
### grunt-contrib-jshint
Validate files with JSHint.
> * [Grunt: css/js と lint/hint](https://www.d-wood.com/wpmt/wp-admin/post.php?post=5042&action=edit)
### grunt-contrib-jst
Precompile Underscore templates to JST file.
### grunt-contrib-less
Compile LESS files to CSS.
### grunt-contrib-nodeunit
Run Nodeunit unit tests.
### grunt-contrib-qunit
Run QUnit unit tests in a headless PhantomJS instance.
### grunt-contrib-requirejs
Optimize RequireJS projects using r.js.
Yeoman でも使われているよう。
> * [grunt.js – Grunt入門 – Qiita [キータ]](http://qiita.com/svartalfheim/items/3968fd94da05f565d18f)
> * [RequireJSでjQueryを使う方法をまとめてみた – へびにっき](http://tkyk.name/blog/2012/11/22/requirejs-with-jquery/)
> * [RequireJSをプロジェクトで使ってみての所感 – ダーシマ・ヱンヂニヤリング](http://tsmd.hateblo.jp/entry/2013/08/06/165357)
> * [grunt-contrib-requirejsを試してみた – SinDiary](http://d.hatena.ne.jp/sinmetal/20130331/1364742840)
### grunt-contrib-sass
Compile Sass to CSS
### grunt-contrib-stylus
Compile Stylus files to CSS.
### grunt-contrib-uglify
Minify files with UglifyJS.
> * [Grunt: JavaScript ファイルの結合・難読化・圧縮をする](https://www.d-wood.com/wpmt/wp-admin/post.php?post=5063&action=edit)
### grunt-contrib-watch
Run predefined tasks whenever watched file patterns are added, changed or deleted.
> * [Grunt: サーバを立ててLiveReload をつかう](https://www.d-wood.com/wpmt/wp-admin/post.php?post=5033&action=edit)
### grunt-contrib-yuidoc
Compile YUIDoc Documentation.
> * [Grunt: YUIDoc](https://www.d-wood.com/wpmt/wp-admin/post.php?post=5045&action=edit)
## その他のプラグイン
### grunt-init
> * [grunt-init でプロジェクトのひな型を scaffold する | deadwood](https://www.d-wood.com/blog/2014/09/15_6804.html)
### grunt-rsync
> * [Grunt: rsync で開発サーバへ deploy する | deadwood](https://www.d-wood.com/blog/2014/08/26_6710.html)
### grunt-markdown-pdf
> * [Grunt: markdown を pdf に変換する | deadwood](https://www.d-wood.com/blog/2014/09/03_6775.html)
### grunt-php
> * [Grunt: PHP のビルドインサーバを使う | deadwood](https://www.d-wood.com/blog/2014/09/02_6704.html)
### grunt-imageoptim
イメージファイルを minify する ImageOptim-CLI Grunt 版。
> * [grunt-imageoptim で画像を最適化する | deadwood](https://www.d-wood.com/blog/2014/09/16_6814.html)
以下、気になっているけど触れていない、その他のプラグイン。
### grunt-connect-proxy
Apache に接続できるそう。
> * [drewzboto/grunt-connect-proxy · GitHub](https://github.com/drewzboto/grunt-connect-proxy)
> * [Gruntのconnectで静的サーバーを動かしつつも、動的なページを表示させたい|Blog|Skyward Design](http://www.skyward-design.net/blog/archives/000166.html)
他にも色々あると思いますが、ひとまずメモっておきます。
[/markdown]