Bowerによるパッケージ管理

BowerはWeb開発用のパッケージ管理ツールです*1。フロントエンドJavaScriptライブラリをインストールしたり、なんか他にもいろいろできそうです。
BOWER: A package manager for the web

インストール

Nodeとnpmがインストール済みであれば、以下のようにコマンドを実行します。

npm install -g bower

パッケージのインストール

パッケージのインストール方法は複数あります。

# カレントディレクトリのbower.jsonファイルからインストール
bower install

# ローカル、リモートパッケージをインストール
bower install <package>

# リモートパッケージをGitタグ指定でインストール
bower install <package>#<version>

たとえば、jQueryをインストールすると次のようになります。

% bower install jquery
bower cloning git://github.com/components/jquery.git
bower cached git://github.com/components/jquery.git
bower fetching jquery
bower checking out jquery#2.0.3
bower copying /Users/murayama333/.bower/cache/jquery/29cb4373d29144ca260ac7c3997f4381
bower installing jquery#2.0.3

% tree 
.
└── bower_components
    └── jquery
        ├── README.md
        ├── bower.json
        ├── component.json
        ├── composer.json
        ├── jquery-migrate.js
        ├── jquery-migrate.min.js
        ├── jquery.js
        ├── jquery.min.js
        ├── jquery.min.map
        └── package.json

2 directories, 10 files

デフォルトだとカレントディレクトリ直下にbower_componentsディレクトリが生成され、その中にjQueryのようなコンポーネントが格納されます。

パッケージの検索

利用可能なパッケージを検索するには以下のように実行します。

bower search [<name>]

たとえば、jQueryを検索すると、次のようにたくさん出力されます。

% bower search jquery
Search results:

    jquery git://github.com/components/jquery.git
    jquery-ui git://github.com/components/jqueryui
    jquery.cookie git://github.com/carhartl/jquery-cookie.git
    jquery-placeholder git://github.com/mathiasbynens/jquery-placeholder.git
    ...

パッケージを利用する

普段通り使用することができます。*2

<script src="/bower_components/jquery/jquery.js"></script>

インストール先ディレクトリを変更する

Bowerの設定ファイル.bowerrcをカレントディレクトリに配置します。.bowerrcはJSON形式で設定を記述します。
パッケージはデフォルトでbower_componentsにインストールされます。これを変更したい場合は、次のように.bowerrcファイルを作成します。

{
    "directory": "hoge"
}

*1:BowerはTwitter社によって公開されています

*2:RequireJSなんかを組み合わせるのがイマドキっぽいです。