javascriptのパッケージ管理ツールBowerの導入

bower js

Bowerとは

BowerはRubyで言うとGemのようなWeb開発向けのパッケージマネージャーです。
JavaScriptだけでなく、ImageやCSSのリソースも管理してくれます。

Bowerを用いることで、プロジェクト毎にjQuery等のリソースを手動でダウンロードして設置する手間が省けます。

さらに、Gemfileのようなプロジェクトに関する設定ファイルを記述することも出来るので、プロジェクトに必要なライブラリが明確に管理できます。

Bowerのインストール

Bowerの利用にはNodeが必要になります。
Node（npm）が利用可能な環境で以下のコマンドでインストールします。

npm install bower -g

使い方

BowerのコマンドはGemに類似しています。

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

bower install jquery

パッケージの検索

bower search jquery

パッケージの確認

bower info jquery

登録されていないパッケージのインストール

Bowerで利用できるライブラリは基本的にはbower-componentsに登録されている物です。
登録されていない物はリソースを明示的に指定することでインストールが可能になります。

bower install https://github.com/n33/skelJS

もしくは短縮形で

bower install n33/skelJS

Bowerプロジェクトの作成

設定

bowerの設定は以下の2つのファイルで行います。

.bowerrc
{
  "directory" : "components",
  "json"      : "component.json",
  "endpoint"  : "https://bower.herokuapp.com"
}
  • directory: ライブラリをインストールする場所を指定
  • json: 参照する設定ファイルの名前
  • endpoint: 参照するレポジトリの場所。記述しない場合は https://bower.herokuapp.com が指定される。
component.json
{
  "name": "project name",
  "version": "0.0.0",
  "dependencies": {
    "bootstrap": null
  }
}
  • name: プロジェクト名
  • version: バージョン指定、最新バージョンの場合はnull
  • dependencies: 依存しているbowerのパッケージ。
インストール
bower install