gistfile1.md

TODO: make gem for this

This was tested using Rails 3.2 and Rails 4.0 on Ruby 2.0.0.

Bower

1. Set the install directory for Bower components:

   // .bowerrc
   {
     "directory": "vendor/assets/components"
   }

2. Follow the Bower instructions and create a bower.json file in your directory with your dependencies, e.g.

   // bower.json
   {
     // ...
     "dependencies": {
       "d3": "~3.1.0",
       "underscore": "~1.4.4",
     }
   }

3. Include them in your JavaScript:

   # config/application.rb
   
   # include Bower components in compiled assets
   config.assets.paths << Rails.root.join('vendor', 'assets', 'components')

   // /Users/aidan/dev/code_cruise/app/assets/javascripts/application.js
   //
   // Bower packages
   //= require d3/d3
   //= require underscore/underscore
   //
   //= require jquery
   //= require jquery_ujs
   // ...

4. Ignore the components in your repo.

   # .gitignore
   /vendor/assets/components
   

5. Install the componenets.

   npm install -g bower
   bower install

At this point, make sure your app runs and the JS libs installed by Bower are loading on the page.

Heroku

To have Heroku deploys (Cedar stack only) install and compile Bower components on push:

1. Use a custom Heroku buildpack that includes Node.js and Bower (see heroku/heroku-buildpack-ruby#67). Alternatively, if you do add the components to your repository (skipping the .gitignore step above), you can skip this step and use the regular Ruby buildpack.

   heroku config:set BUILDPACK_URL='git://github.com/qnyp/heroku-buildpack-ruby-bower.git#run-bower'

2. Add the following to config/application.rb:

   # via https://github.com/sstephenson/sprockets/issues/347#issuecomment-25543201
   
   # We don't want the default of everything that isn't js or css, because it pulls too many things in
   config.assets.precompile.shift
   
   # Explicitly register the extensions we are interested in compiling
   config.assets.precompile.push(Proc.new do |path|
     File.extname(path).in? [
       '.html', '.erb', '.haml',                 # Templates
       '.png',  '.gif', '.jpg', '.jpeg', '.svg', # Images
       '.eot',  '.otf', '.svc', '.woff', '.ttf', # Fonts
     ]
   end)

3. Change the following setting to allow assets to be compiled in production (I don't believe this is Bower-specific):

   # config/environments/production.rb
   config.assets.compile = true

Try a deploy: it should successfully compile assets.

---

It's just that easy!!! ::facepalm::

Additional resources:

• http://dev.af83.com/2013/01/02/managing-rails-assets-with-bower.html
• http://kaeff.net/posts/sprockets-bower-better-component-packaging-for-rails-asset-pipeline.html