Google製「Web Starter Kit」を使うための環境設定

https://developers.google.com/web/starter-kit/

Google、I/Oカンファレンスを控えてマルチプラットフォーム・ウェブアプリのテンプレート、Web Starter Kitを発表 | TechCrunch Japan

Githubのtrendingで1位だったので使ってみることにしました。最近自分はgruntを使い始めましたが、gulpという別のビルドツールを使っているようで興味を持ちました。またファイルや画像を圧縮の最適化がされていおり、モバイルで作るときは便利そうとも思いました。
Gituhub
https://github.com/google/web-starter-kit

使い方の資料

・使い方のドキュメント
https://developers.google.com/web/fundamentals/tools/setup/setup_kit

説明が丁寧

Most of your interactions with the Web Starter Kit will be through the command line. Run commands in the Terminal app if you’re on Mac, your shell in Linux, or Cygwin if you are on Windows.

「ターミナル入れてくれよな。Windowsの人はCygwinで」という説明も書かれており、丁寧な印象を受けました。

インストール&アップデート

Gulp

自分はgulpを使ったことがなかったのでインストールしました。
https://github.com/gulpjs/gulp/blob/master/docs/getting-started.md#getting-started

Sassのヴァージョンアップ

$sass -v
Sass 3.2.19 (Media Mark)

$sudo gem update sass
$sass -v
Sass 3.3.8 (Maptastic Maple)

Sassのバージョン「3.3.x」を使う必要があったのでアップデートしました。

package.jsonのモジュールを読み込む

$ sudo npm install

gulpを始め、様々なモジュールを一気に読み込みます。

エラー:too many open files

Error: EMFILE, too many open files

こんなエラーが出ました。

Too many open files - getcwd (Errno::EMFILE)でハマった件 - SpringMT
これを読んで解決。

npm WARN unmet dependency

モジュールが見つからない

npm WARN unmet dependency

というエラーがたくさんでました。

nodeをアップデート

sudo npm cache clean -f
sudo npm install -g n
sudo n stable
$ node -v
v0.10.29

nodeをアップデートはできました。「npm WARN unmet dependency」がさらに増えました笑。

gulpコマンドでエラー

appディレクトリでgulpすると

module.js:340
throw err;
^
Error: Cannot find module 'sequencify'

というエラーも出ました。

npmをupdate

npm自体をupdateしようと思ったら全部アップデートしてました。

$npm update

すごく時間がかかりましたが、「npm WARN unmet dependency」の数が一つだけになりました。

web-starter-kit/node_modules/gulp-load-plugins/node_modules/globule/node_modules/minimatch

というエラーの記述があったので「gulp-load-plugins」だけ個別にインストールすることにしました。

sudo npm install gulp-load-plugins

そうすると「gulp-load-plugins」のエラーは消えました。

Gulpで起動

gulp server

で起動することが出来ました!