Rails 3.1 RC5 + CSS and JS compression + undefined method `compress’ for :scss:Symbol in production mode

When running Rails 3.1RC5 with environments/production.rb containing:

  config.assets.js_compressor  = :uglifier
  config.assets.css_compressor = :scss
  config.assets.compress = true

probably you will see this type of exception:

undefined method `compress' for :scss:Symbol
  (in /home/path/app/assets/stylesheets/layouts/admin/default/init.scss)

But why? Lets go deeper ;) JS and CSS compression is quite simple. We have uncompressed stuff - we throw it into compressor and we have compressed version on output. Rails compression engine executes method called compress with one string parameter containing uncompressed stuff. We should also return string - containing input string compressed version.

Since we point out symbol as our default compressor - Rails will try to execute compress on this symbol. How can we fix this? There are two ways. First one is easy - screw compression:

  config.assets.compress = false

Second one is slightly more difficult (but still easy). We just need to attach our own compressors.

Javascript compression

Lets use Uglifier to compress our JS. We need to add it into gemfile

gem 'uglifier'

and we need to tell Rails - that it should use it to compress JS(in environments/production.rb):

  # Put this on top of production.rb file
  require 'uglifier'
  # Somewhere in the "middle"
  config.assets.js_compressor  = Uglifier.new

CSS compression

I compress CSS using my own compressor. It is a hybrid compressor including SASS and my own CSS Image Embeddera. I've managed to have SASS one line compression and embedded css backgrounds. How to use it?

Add into gemfile:

gem 'css_image_embedder'

and then attach my compressor in environments/production.rb:

  img_root = File.join(Rails.root, 'public')
  config.assets.css_compressor = CssImageEmbedder::Compressor.new(img_root)

Conclusions

CSS and JS compression worked really well already in Rails 3.0. However now we can easily get into whole process and do cool stuff (like css image embedding ;) ).

[Update] One more thing: from now I will be posting only in english.