CODEWITHSUNDEEP
ruby-on-railsrubyasset-pipeline
Nick Vanderbilt
Nick Vanderbilt

Reputation: 2535

why is rails trying to precompile .css file

I am using Rails 3.1 and in my assets/stylesheets I have bunch of .css and .scss files.

It seems Rails is trying to precompile .css files and they blow up with following message:

Invalid CSS after "...{padding-bottom": expected "{", was ";0;}#order_deta..."

If I have only .css files and if I comment out sass-rails gem from Gemfile then everything works.

group :assets do
  #gem 'sass-rails',   '~> 3.1.4'
  gem 'coffee-rails', '~> 3.1.1'
  gem 'uglifier', '>= 1.0.3'
end

So now the question is, do I have to convert all my .css into .scss to play nice with asset precompilation or is there a workaround?

Update:

Here is my code:

config.assets.paths << "#{Rails.root}/app/themes/vanilla/assets/stylesheets"
config.assets.paths << "#{Rails.root}/app/themes/vanilla/assets/javascripts"
config.assets.paths << "#{Rails.root}/app/themes/vanilla/assets/images"
config.assets.precompile += ['vanilla.css', 'vanilla.js']

vanilla.css looks like this:

/*
 * This is a manifest file that'll automatically include all the stylesheets available in this directory
 * and any sub-directories. You're free to add application-wide styles to this file and they'll appear at
 * the top of the compiled file, but it's generally better to create a new file per style scope.
 *
 *= require 'reset'
 *= require 'vroom'
 *= require_self
*/

Here reset is reset.css and vroom is vroom.css.scss

This is the error I am getting:

Invalid CSS after "...{padding-bottom": expected "{", was ";0;}#order_deta..."
(in .........../stylesheets/vanilla.css)

This error is happening because Rails is trying to precompile reset.css.

If I remove the sass-rails gem and all .scss files then rake assets:precompile works.

Upvotes: 3

Views: 2258

Answers (2)

saada
saada

Reputation: 2781

I had the same problem and found the solution!

In my case, I had this line:

@import "bootstrap"

All I had to do was to add a semicolon

@import "bootstrap";

Small, but deadly mistake!

Upvotes: 1

Richard Hulse
Richard Hulse

Reputation: 10493

You do not have to convert your files. What is happening here is that the SCSS processor is checking the syntax of your CSS files even though they are not processed as SCSS.

Have a close look at the line being complained about. The error seems to be saying that you have a semicolon (;) between an attribute and value instead of a colon (:)

Possibly this:

{padding-bottom;0;}

instead of this:

{padding-bottom:0;}

By removing the gem, you are removing the syntax check, so the file will be compiled as is.

Upvotes: 4

Related Questions