読者です 読者をやめる 読者になる 読者になる

サラリーマンIT技術者の調査レポート

日々の業務で気付いた当たり障りのない技術的なあれこれを綴ります。

まっさらな状態からWindowsでYeomanを動かすまでの手順

JavaScript Node.js Yeoman

Yeoman初心者がWindows7(64bit)でYeoman - Modern workflows for modern webappsを動かすまでの手順を記録しておきます(2013/12/11時点)。
Yeomanについてほぼ何もわかってない状態で書いてますので、間違いなどありましたらお知らせください。

事前にインストールするもの

これらはひたすらインストーラの指示に従ってインストールします。
基本的にはインストーラお勧めのデフォルト設定で問題ないのですが、GitとRubyについてはPATH環境変数でパスを通すように指定します。
また、それぞれのインストールの順番は関係ありません。

ひたすらコマンド実行(と、ちょっと手直し)

以上3つのインストールが完了したら、スタートメニューからNode.js>Node.js command promptを選択して例の黒い画面を表示します。
続いて

をインストールして、Yeomanのwebappを作成します。

>gem update --system
>gem install compass
>npm install -g yo generator-webapp
>mkdir yeomanprj
>cd yeomanprj
>yo webapp

Yeomanさんが何やら尋ねてきますが、よくわからないので十字キーとスペースキーを使って

  • [X]Bootstrap for Sass
  • [X]Modernizer

のXを外して確定します。
lib-jpeg62.dllのエラーが出ますがこれもよくわからないのでスルーします。
続いて

>grunt

とするとgruntがエラーで止まります。Gruntfile.jsに2つエラーがありますよ、ということなのでyeomanprjフォルダの直下にあるGruntfile.jsを編集します。
編集する内容は304、305行目の先頭にスペースを2つ入れるだけです(!!)。
編集するときはメモ帳だと改行が崩れてワケがわからないので、Unixの改行コードが正しく表示できるエディタを使います。
再度

>grunt

として、最後に

Done, without errors.

が出れば、たぶん何かが成功です。最後にbowerでjqueryをインストールしつつ

>bower install query
>grunt server

として、ブラウザにこのような画面が表示されたら完了です。
f:id:k_aruga:20131211203638p:plain
お疲れ様でした。