「Flight試してみたい!」でWindowsにBowerをインストールする

2013.02.07

こんにちは。クラスメソッドの稲毛です。

Twitterから「Flight」と呼ばれるJavaScriptフレームワークが公開されました。
早速試してみようと思ったのですが、同じくTwitterの「Bower」によってパッケージ管理されているということなのでまずはBowerをインストールしました。

Bowerについて詳しくは、ちょうど先日公開されました弊社中村の記事をご覧ください。

用意したもの

OS
Windows 7 Enterprise 64bit SP1
Node.js
node-v0.8.18-x64.msi
Git for Windows
Git-1.8.1.2-preview20130201.exe

Node.jsのインストール

早速、Node.jsをインストールします。インストーラの指示通りに進めるだけで特別な設定は必要ありませんでした。(Bowerのインストールに必要なNPMも同時にインストールされます。)

インストーラを起動し、「Next」ボタンを押下します。

WS000000

ライセンス条項を確認して……

WS000001

同意したらチェックボックスにチェックを入れて「Next」ボタンを押下します。

WS000002

インストールが開始します。

WS000003

「Finish」ボタンを押下してインストーラを終了します。

WS000004

コマンドプロンプトで「node」コマンドが有効になっていればインストール成功です。

C:\Users\inage.toru>node --version
v0.8.18

Gitのインストール

現在Windows用のGitには「Git for Windows」と「msysGit」があるようです。ここでは「Git for Windows」を使用しました。

インストーラを起動し、「Next」ボタンを押下します。

WS000009

こちらもライセンス条項を確認して……

WS000010

同意したら「Next」ボタンを押下します。

WS000011

インストール場所を指定して「Next」ボタンを押下します。デフォルトで問題ありませんでした。

WS000012

オプションもデフォルトのまま「Next」ボタンを押下します。

WS000013

スタートメニューの設定もそのままで「Next」ボタン。

WS000014

PATHの設定では「Run Git from the Windows Command Prompt」を選択します。Bowerがコマンドプロンプト上でGitを使用する為です。

WS000015

改行コードについてはデフォルトのままとしました。

WS000016

「Finish」ボタンを押下します。

WS000017

コマンドプロンプトで「git」コマンドが有効になっていればインストール成功です。

C:\Users\inage.toru>git --version
git version 1.8.1.msysgit.1

msysGit

「msysGit」を利用する場合はmsysGitのbinを環境変数PATHに手動で設定します。さらに、環境によっては「libiconv-2.dll」が無いと言われることがありますので別途用意し、binに配置する必要があります。

WS000008

Gitを利用するだけであれば「Git for Windows」をインストールした方が楽ちんですね。

Bowerのインストール

Bowerは「NPM」を利用してインストールします。

C:\Users\inage.toru>npm install bower -g
npm http GET https://registry.npmjs.org/bower
npm http 304 https://registry.npmjs.org/bower
npm http GET https://registry.npmjs.org/tmp
npm http GET https://registry.npmjs.org/archy
                    :

下記のように表示されればインストールは完了です。

                    :
C:\Users\inage.toru\AppData\Roaming\npm\bower -> C:\Users\inage.toru\AppData\Roaming\npm\node_modules\bower\bin\bower

> bower@0.7.0 postinstall C:\Users\inage.toru\AppData\Roaming\npm\node_modules\bower
> node cleanup

bower@0.7.0 C:\Users\inage.toru\AppData\Roaming\npm\node_modules\bower
├── stable@0.1.3
├── archy@0.0.2
├── colors@0.6.0-1
├── semver@1.1.2
├── tmp@0.0.16
├── async@0.1.22
├── mkdirp@0.3.4
├── hogan.js@2.0.0
├── request@2.11.4
├── lodash@0.9.2
├── rimraf@2.0.3 (graceful-fs@1.1.14)
├── nopt@2.0.0 (abbrev@1.0.4)
├── fstream@0.1.21 (inherits@1.0.0, graceful-fs@1.1.14)
├── tar@0.1.16 (inherits@1.0.0, block-stream@0.0.6)
├── vows@0.6.4 (eyes@0.1.8, diff@1.0.4)
├── rc@0.0.7 (config-chain@1.1.4, optimist@0.3.5)
├── read-package-json@0.1.12 (graceful-fs@1.1.14, lru-cache@2.0.4, slide@1.1.3, npmlog@0.0.2)
├── glob@3.1.17 (inherits@1.0.0, graceful-fs@1.1.14, minimatch@0.2.9)
└── unzip@0.0.4 (pullstream@0.0.4, binary@0.3.0)

コマンドプロンプトで「bower」コマンドが有効になっていればインストール成功です。

C:\Users\inage.toru>bower --version
0.7.0

まとめ

意外とWindowsでのBowerインストール情報が無かったので記事にしてみました。次回は本編である「Flight」を試してみます!

参照