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

bowerについて

javascript bower

bowerが0.9.2になり、gitリポジトリが変更になりました。

基本

bowerとは、WebのJavaScript package managerです。 npmやgem、cartonのように、jqueryやd3、angularなど、プロダクトのwebで必要なpackageを管理するツールです。

インストール

$ npm install -g bower

以上

使い方

$ bower install <package>
$ bower install <package>#<version>

<package>ではいろいろ指定出来ます

  • jqueryのように、Bowerで登録してあるパッケージ名
  • gitのpublic/privageのエンドポイント 例) git://github.com/someone/some-package.git
  • ローカルgitのエンドポイント
  • gitエンドポイントの省略名 例) someone/some-package (defaults to GitHub).
  • zipやtar.gzなどを含むファイルのURL

また、ドキュメントにはありませんがローカル使えるのは社内的にはよかったりします。

  • ローカルディレクトリ 例) /home/hoge/sampleproject

リポジトリ

2013/04/28現在、登録されているリポジトリ数は1841で、npmのように結構きつい状況が起きる気配ムンムンです。下記のコマンドで一覧が出てきます。

$ bower search
$ bower search | wc -l
1841

ちなみに、カテゴリ内訳としては下記のようになっています。

$ bower search | perl -nle 'my @package = split(/[\s\-]+/); print $package[1];' | sort | uniq -c | sort -r | head -n 10
 107 jquery
  68 angular
  39 armory
  32 backbone
  23 bootstrap
  18 x
  14 suit
   9 stitch
   9 requirejs
   8 songlocator

bowerの設定

bowerは下記のように--save / --save-devをつけることでpackageのリストを作成してくれます。

$ bower install <package> --save 
$ bower install <package> --save-dev

これにより、bower.json (components.jsonから変更になりました)にはこんな感じで、dependenciesとして依存するpackageが記録されていきます。

{
  "name": "sample",
  "version": "0.0.0",
  "dependencies": {
    "jquery": "~2.0.0"
  }
}
$ bower install

とpackageを指定しないでコマンドを実行した時には、このbower.jsonの情報をもとにpackageをとってきてインストールをしてくれます。

注意

インストール先のディレクトリはデフォルトでは componentsになっています。 これは、bower.jsonを書き換えても絶対に変わりません

例えば、expressなどを利用していてインストール先をpublic/componentsに変えたい場合は.bowerrcをプロジェクトのトップに置くか、~/.bowerrcを書くかのどちらかになります。 この中で

{
  "directory": "public/components"
}

とすることで変更することができます。

気持ち的には、「bower.jsonで変更させろや!」って思うこともあるのですが、後述のリポジトリ作成の観点を考えるとこれが妥当なのかもなあとは思います。

リポジトリ開発

$ bower init

とすることでbower.jsonを作成します。 ここに登録したいプロジェクトの情報(このエントリでは割愛)を記載していきます。

この情報はプロジェクトを利用する人に影響をおよぼすため、インストールディレクトリの情報をbower.jsonでは変更できないようにしているようです。