public
Last active

Install Compass in Rails 3.1/3.2

  • Download Gist
Gemfile
Ruby
1 2 3 4 5 6 7
group :assets do
gem 'compass-rails','~> 1.0.0.rc.2'
gem 'compass-colors'
gem 'sassy-buttons'
gem 'sass-rails', '~> 3.2.3'
# non-compass gems omitted for brevity
end
application.rb
Ruby
1 2
# Precompile *all* assets, except those that start with underscore
config.assets.precompile << /(^[^_\/]|\/[^_])[^\/]*$/
application.scss
SCSS
1 2 3 4 5 6 7 8 9 10 11 12 13
/*
* application.scss
*
* Important! Do *not* use Sprockets "require" syntax.
* Use @import to include other stylesheets and Compass mixins.
*/
 
// Include some nice mixins
@import "compass/css3";
@import "sassy-buttons";
 
// Example: import partial stylesheet named "_users.scss"
@import "users";
compass.rb
Ruby
1 2
# config/compass.rb
additional_import_paths = ["app/assets/stylesheets/basics", "app/assets/stylesheets/shared"]
digest_for-error
1 2 3 4
A ActionView::Template::Error occurred in sessions#new:
 
1024.css isn't precompiled
.bundle/bundle/gems/actionpack-3.2.0/lib/sprockets/helpers/rails_helper.rb:142:in `digest_for'
example.scss
SCSS
1 2 3 4
.logo
{
background: image-url("logo-small.png") no-repeat;
}
rake-output
1 2 3 4 5 6 7 8 9 10 11 12 13
$ bundle exec rake assets:precompile
/Users/mbrictson/.rbenv/versions/1.9.3-p0/bin/ruby script/rake assets:precompile:all RAILS_ENV=production RAILS_GROUPS=assets
rake aborted!
Undefined variable: "$body-text-line-height".
(in /Users/mbrictson/Work/rails-project/app/assets/stylesheets/basics/_grid.scss)
 
Tasks: TOP => assets:precompile:primary
(See full trace by running task with --trace)
rake aborted!
Command failed with status (1): [/Users/mbrictson/.rbenv/versions/1.9.3-p0/...]
 
Tasks: TOP => assets:precompile
(See full trace by running task with --trace)
tree
1 2 3 4 5 6 7 8 9 10 11 12 13 14
.
├── Gemfile
├── app
│ └── assets
│ ├── images
│ │ └── logo-small.png
│ ├── javascripts
│ │ └── application.js
│ └── stylesheets
│ ├── _users.scss
│ └── application.scss
└── config
├── application.rb
└── compass.rb

First.. great post.. i went through the compass 3.2 pain and I thought i had it working beautifully a month or so back

However oddly my images seem flaky
My Compass/Sass all works beautifully. But I notice almost daily that when I start work. My images wont show up on my "development" webrick environment

My log says
Started GET "/assets/home/sms.png" for 127.0.0.1 at 2012-02-23 07:22:55 -0500
Served asset /home/sms.png - 200 OK (8ms)

But its a 0Byte file.

I usually try a
rake assets:clean:all RAILS_ENV=development RAILS_GROUPS=assets

and I usually try incrementing
config.assets.version= '3' in the config/application.rb

And after a few random attempts.. images start to appear. BUT i have no clue what the magic is..

Do you have any thoughts/recommendations? Really killing my productivity. I should mention when images are not working /Compass continues to work like a charm

this my application.rb

42 config.filter_parameters += [:password]
43 config.assets.enabled = true
44 config.sass.line_comments = false
45 config.sass.syntax = :nested
46 #config.assets.precompile << /(^[^]|\/[^])[^\/]/
47 #http://blog.55minutes.com/2012/01/getting-compass-to-work-with-rails-31-and-32/

48 config.assets.precompile << /(^[^\/]|\/[^])[^\/]
$/
49 config.sass.preferred_syntax = :sass
50 config.assets.version= '3'

this is my gemfile.rb

45 group :production do
46 # gem 'thin'
47 end
48
49 group :assets do
50 gem 'tilt', :git => 'git://github.com/rtomayko/tilt.git'
51 gem 'sass-rails', '~>3.2.0'
52 gem 'coffee-rails'
53 gem 'uglifier'
54 gem 'compass', '~> 0.12.alpha'
55 gem 'compass-susy-plugin', :require => 'susy'
56 gem 'compass-960-plugin'
57 gem 'fancy-buttons'
58 end

@jwoodlee good question. The asset pipeline can be a bit inscrutable with these kinds of errors. I would try a few things:

  1. Assets not being served via webrick could be a sign that Rails is running in production mode. It is worth double-checking that webrick is booting in development mode:

    => Rails 3.2.1 application starting in development on http://0.0.0.0:3000
    
  2. As I mentioned in another recent post, I've solved problems like these by completely wiping out the Rails file system cache. (This is a one-time fix. You shouldn't have to do this every time you start the app.)

    rm -rf tmp/* public/assets/*
    
  3. Images of zero bytes in length sounds suspiciously like the behavior controlled by action_dispatch.x_sendfile_header (normally only found in production.rb), where Rails sends a special X-Sendfile or X-Accel-Redirect header intended for the web server, rather than serving the image data itself. Using a tool like Safari or Chrome's Web Inspector, check the headers being returned with the zero-byte image. If these special headers are there, it could mean that you've mistakenly included production-specific settings into your development config.

Matt -

Thanks so much! You solved it with the 3rd point :) Really appreciate it! I responded on the Gist. I had also asked the same question on stack overflow - if you would like to copy /paste your gist I can give you points there
http://stackoverflow.com/questions/9413619/rails-3-2-asset-pipeline-not-working-for-images-but-is-for-compass

Thanks again
Jason

On Feb 23, 2012, at 12:27 PM, Matt Brictson wrote:

@jwoodlee good question. The asset pipeline can be a bit inscrutable with these kinds of errors. I would try a few things:

  1. Assets not being served via webrick could be a sign that Rails is running in production mode. It is worth double-checking that webrick is booting in development mode:

    => Rails 3.2.1 application starting in development on http://0.0.0.0:3000

  2. As I mentioned in another recent post, I've solved problems like these by completely wiping out the Rails file system cache. (This is a one-time fix. You shouldn't have to do this every time you start the app.)

    rm -rf tmp/* public/assets/*

  3. Images of zero bytes in length sounds suspiciously like the behavior controlled by action_dispatch.x_sendfile_header (normally only found in production.rb), where Rails sends a special X-Sendfile or X-Accel-Redirect header intended for the web server, rather than serving the image data itself. Using a tool like Safari or Chrome's Web Inspector, check the headers being returned with the zero-byte image. If these special headers are there, it could mean that you've mistakenly included production-specific settings into your development config.


Reply to this email directly or view it on GitHub:
https://gist.github.com/1685685

I have a problem with running Compass according to the instructions on
http://blog.55minutes.com/2012/01/getting-compass-to-work-with-rails-31-and-32/

EDIT: The problem is caused by setting:

config.assets.compile = true

in config/environments/production.rb

When it is set to true then Rails tries to compile missing assets on demand when running in production mode. To achieve that it needs Compass and other stuff, that is only available in development and test environments (as set in Gemfile).

The problematic part of the mentioned entry is a note that one should avoid directly requiring compass in the Gemfile.
In my case putting only compass-rails in Gemfile causes Compass global constant to be invisible and causes errors to be thrown when in production mode. That's because the compass gem is not loaded. Here is the example error I got:

ActionView::Template::Error (File to import not found or unreadable: blueprint/reset.
Load path: Sass::Rails::Importer(/myapp/assets/stylesheets/print.css.scss)
  (in /myapp/assets/stylesheets/print.css.scss)): […]

That's just the effect of my initializers/sass.rb being unable to set proper paths.
My code for setting the paths for SASS is:

if Rails.application.config.respond_to?(:sass)
  Rails.application.config.sass.tap do |sass|

    sass.load_paths.tap do |load_paths|
      load_paths << File.join(Rails.root, 'app', 'assets', 'stylesheets')
      if Kernel.const_defined?( :Compass )
        ['compass','blueprint'].each do |compass_framework|
          load_paths << Compass::Frameworks[compass_framework].stylesheets_directory
        end
      end
    end

    sass.line_comments    = Rails.env.production? ? false : true
    sass.preferred_syntax = :scss
  end
end

Conclusion: either put compass-rails out of assets group in Gemfile or disable config.assets.compile in config/environment/production.rb.

@siefca, yes, the config.assets.compile=true setting is problematic in production. Usually you will not want to do this. If you have good reason to set config.assets.compile=true, then you will need to ensure the asset pipeline gems are loaded.

I actually describe this in detail in the following blog post (see the config.assets.compile section):

http://blog.55minutes.com/2012/02/untangling-the-rails-asset-pipeline-part-3-configuration/

@mbrictson: That;s true. I'm just using it as a workaround, since rake assets:precompile takes sometimes up to 10 minutes with Sprockets and Compass.

Just a note, but in 'application.scss', @import "sassybuttons" should be @import "sassy-buttons" as per https://github.com/jhardy/Sassy-Buttons/issues/14

Please sign in to comment on this gist.

Something went wrong with that request. Please try again.