あなたのWeb開発人生を変えるYeoman、Bower、Yoのインストールと使い方：Gruntで始めるWeb開発爆速自動化入門（終）（2/3 ページ）

JavaScriptメインでWeb開発を行う際にさまざまな作業を自動化して開発効率を爆発的に高めるツールなどを紹介していく連載。今回は、プロジェクトひな型生成の「Yo」とパッケージマネージャー「Bower」、そして「Grunt」の3つで構成される「Yeoman」の概要と基本的な使い方を紹介。

[中村修太，クラスメソッド]

Bowerの基本的な使い方

　Bowerを使用すれば、JavaScriptライブラリの管理を簡単に行えます。まずはbowerモジュールをnpmでインストールしましょう。次のように、-gオプション（グローバルインストール）を付けてbowerモジュールをインストールします。

% mkdir bowerSample && cd bowerSample
% npm install -g bower

　インストールできたらBowerを実行してみましょう。-vオプションでバージョンが表示されればインストール完了です。

% bower -v
1.3.5

　準備ができたらinitコマンドでBowerを初期化します。initコマンドを実行後、名前やバージョン情報などの設定情報を対話形式で入力していきます。今回は全てデフォルトで構いませんので、入力していきましょう。

% bower init
・
・
・

　全て情報を入力すると、bower.jsonという管理用ファイルが生成されます。このファイルにはライブラリ名や依存関係が記述されます。

　次に、Bowerを使って「Underscore.js」をインストールしてみましょう。installコマンドを使用してモジュール名を指定すれば、インストールが開始されます。

% bower install underscore --save
・
・
・
bower underscore#~1.6.0        install underscore#1.6.0% bower install underscore --save

　なお、実際にインストールされたライブラリは、「app/bower_components/underscore/」に配置されます。

Bowerでよく使うコマンド5選

　ここからは、Bowerでよく使用されるコマンドを紹介していきましょう。

【1】install

　先ほども使用した、Bowerでライブラリをインストールするためのコマンドです。以下のようにすることで、指定したライブラリを取得できます。

bower install ｛バージョン｝

　gruntコマンドと同じく「--save」「--save-dev」オプションを使用すれば、bower.jsonに依存関係を記述してくれます。また、既存のbower.jsonにすでに依存関係が記述されている場合、以下のように入力すれば、依存ライブラリをインストールできます。

bower install

　ライブラリ名の後に「#｛バージョン｝」を記述すれば、任意の｛バージョン｝のライブラリをインストールできます。

【2】list

　インストール済みのライブラリの一覧を表示するためのコマンドです。

% bower list
bower check-new     Checking for new versions of the project dependencies..
bowerSample#0.0.0 /path/your/bowerSample
└── underscore#1.6.0

【3】info

　ライブラリの詳細を確認できるコマンドです。ライブラリ名の後に「#｛バージョン｝」を指定すれば、その｛バージョン｝の詳細を確認できます。

%bower info underscore
bower underscore#*              cached git://github.com/jashkenas/underscore.git#1.6.0
bower underscore#*            validate 1.6.0 against git://github.com/jashkenas/underscore.git#*
・
・
・

【4】search／lookup

　ライブラリを名前で検索するためにはsearchコマンドを使用します。以下のように入力すれば、部分一致でライブラリを検索してくれます。

bower search ｛ライブラリ名｝

　以下はコマンドの例です。

% bower search underscore
Search results:
 
    underscore git://github.com/jashkenas/underscore.git
    underscore-amd git://github.com/amdjs/underscore.git
・
・
・

　なお、searchでなく「lookup」コマンドだとライブラリ名の完全一致で検索します。

【5】uninstall

　ライブラリをアンインストールするにはuninstallコマンドを使用します。

%bower uninstall underscore --save
bower uninstall     underscore

　こちらもinstallコマンドと同じく、「--save」「--save-dev」オプションを付けることによりbower.jsonの依存性を変更します。

他のコマンドは公式サイトで

　以上がbowerの基本的なコマンドです。これら以外にもいくつかコマンドがありますので、詳しくはGitHubの「README.md」をご確認ください。