BowerでJavaScriptのライブラリをラクラク管理

bower-logo

最近はどの言語でもモジュールのパッケージ化の考え方が進んでいますね!
NodejsのnpmやRubyのGemはとても一貫性が高くて好きです。
そして、その潮流はクライアントサイドのウェブ開発分野にも及んでいます。
TwitterがBowerというJavaScript/CSSのライブラリをパッケージ管理できるツールを公開しています。
これを使えば、ライブラリ間の依存関係をあまり意識せずに、手間をかけずに使う事ができますね!

Ruby on Railsでも簡単に使えるようなgem bower-railsが提供されています。
至れり尽くせりですね!

Railsで使う場合の使い方をざっとご紹介します。
インストールはnpmのコマンド一発。

#!bash
$ npm install -g bower

以下の行をGemfileに追記しましょう。

#!ruby
gem 'bower-rails', '~> 0.6.1'

依存関係はBowerfileという名前のファイルに以下のように記述します。

#!ruby
assets_path "assets/javascripts"

# Puts files under ./vendor/assets/javascripts
group :vendor do
  asset 'jquery'    
  asset 'jquery-ui' 
  asset 'jquery-ui-touch-punch' 
  asset 'jquery-ujs' 
  asset 'jquery-placeholder' 
  asset 'jquery.tagsinput' 
  asset 'modernizr' 
  asset 'bootstrap-select' 
  asset 'bootstrap-switch' 
  asset 'bootstrap3-typeahead' 
  asset 'BigVideo.js' 
end

使いたいライブラリがBowerにあるか調べるには、以下のコマンドを実行します。

#!bash
$ bower search <keyword>

gemとかpodと一緒ですね!
準備ができたらインストールしましょう。

#!bash
$ rake bower:install

これで、vendor/assets/javascripts/bower_components のディレクトリ下にインストールされます。
また、Bowerを単体で使う時に必要なファイルがvendor/assets/javascripts/bower.jsonに生成されているのが確認できます。

使ってみた感想としては、Rails用のgemがあるならそっちを使った方がすんなり動く印象です。
js単体のライブラリなどの使用に適しているのではと思いました。

投稿者:

Takuya

Digital crafts(man|dog). Love photography. Always making otherwise sleeping. born in 1984.

コメントを残す

以下に詳細を記入するか、アイコンをクリックしてログインしてください。

WordPress.com ロゴ

WordPress.com アカウントを使ってコメントしています。 ログアウト /  変更 )

Google フォト

Google アカウントを使ってコメントしています。 ログアウト /  変更 )

Twitter 画像

Twitter アカウントを使ってコメントしています。 ログアウト /  変更 )

Facebook の写真

Facebook アカウントを使ってコメントしています。 ログアウト /  変更 )

%s と連携中