Paul Elliott

This article was contributed by Paul Elliott

Hashrocket is a premiere Ruby on Rails design & development shop, with offices in Chicago and Florida. They specialize in pair programming, test-driven development, user-centered design, and on-site training.

Using Sass on Bamboo

Last Updated: 02 April 2014

css sass

Table of Contents

This article applies to apps on the Bamboo stack. For the most recent stack, Cedar, see Rails 3.1 on Heroku Cedar.

If you’d like to use Sass in your Heroku app on the Bamboo stack, you’ll need to do some configuration - by default, Sass generates CSS files in public/stylesheets, which isn’t writable on Heroku.

Gems

The first step is to require the gem that you’ll need. In your Gemfile, add the following:

gem 'sass'

Configuration

Please note that if you use this technique, all stylesheet requests will be redirected to tmp – which means that any CSS files you leave in public/stylesheets will be ignored.

Next, you’ll need to direct Sass to save the generated files to tmp and tell Rails how to access them. In config/initializers/sass.rb:

Sass::Plugin.options.merge!(
  :template_location => 'public/stylesheets/sass',
  :css_location => 'tmp/stylesheets'
)

Rails.configuration.middleware.delete('Sass::Plugin::Rack')
Rails.configuration.middleware.insert_before('Rack::Sendfile', 'Sass::Plugin::Rack')

Rails.configuration.middleware.insert_before('Rack::Sendfile', 'Rack::Static',
    :urls => ['/stylesheets'],
    :root => "#{Rails.root}/tmp")

Start using Sass

Once your configuration is complete, you’re free to start using Sass. For detailed instructions, check out the Sass documentation.