Rails AssetsでBundler経由でBowerのcomponentsを管理する

Rails Assets というツールが、最近の悩みを解決してくれそうだったので試してみた。

できること

Rails Assets is the frictionless proxy between Bundler and Bower.
It automatically converts the packaged components into gems that are easily droppable into your asset pipeline and stay up to date.

公式に書いてあるとおり。

使い方

1. Componentを検索

https://rails-assets.org/components

なければ、追加する

2. Gemfile にsource 'https://rails-assets.org' を追加、’rails-assets-BOWER_PACKAGE_NAME’という名前でgemを追加して、bundle install

Gemfile

source 'https://rubygems.org'
source 'https://rails-assets.org'
・・・
gem 'rails-assets-BOWER_PACKAGE_NAME'

3. ’BOWER_PACKAGE_NAME’で、JS,CSSにrequire

application.js

//= require ’BOWER_PACKAGE_NAME’

application.css

/*
 *= require ’BOWER_PACKAGE_NAME’
 */

簡単！

You can now require BOWER_PACKAGE_NAME in your stylesheets and JavaScript files—all assets exposed as main in bower.json will be automatically included.

※ただし、bower.jsonのmain定義にあるファイルをassetsに読み込む仕組みなので、ライブラリによってはうまくワークしない。

これまでの悩み

今まで、JSのライブラリもgemパッケージ化することでbundlerで使うことができていたのだけど、

• ライブラリ本体に追随して更新されるのが遅い（放置される）場合も多い
• JSだけなのに、わざわざgem化してまでBundlerで管理したくない（Rails用にrakeタスクが用意されている等、追加機能がある場合は良いとして）

というのが問題だったと思う。
JSライブラリはBowerで管理したくなるんだけど、二重管理になるし、herokuデプロイするときに気を使う必要がある。

参考：

RailsプロジェクトにBowerを導入してHerokuへデプロイする - QNYP Blog

私はカスタムbuildpackを使うのには多少抵抗があったので、42dev/bower-rails でvendor配下にライブラリ配置した上で、必要ファイルだけ.gitignoreで制御してレポジトリに含めておくという方法を使っていた。

• bower updateの度にgit差分出てしまうのが難点
• カスタムbuildpackで、bower installするとbowerレポジトリの余計なファイルもたくさん引っ張ってきてしまうので、slug size増加してしまうのでは？という懸念もあった。（未検証）

結論

上記のもやもやを上手く解決してくれるナイスなアプローチだと思う。