Why does rake assets:precompile produce an empty css stylesheet?

Question

I'm using sass-rails and haml-rails gems, so that I can write css file in HAML-sass style.

The thing is when I want to go for production and precompile my stylesheet, the command rake assets:precompile run without error but the generated application.css is empty.

Here it is my Gemfile :

source 'https://rubygems.org'

gem 'rails', '~>3.2'
gem 'pg', '>= 0.14'
gem 'haml-rails' #, '~> 0.3'

group :development, :test do
  gem 'factory_girl_rails'
end

group :developpement do
  gem 'rspec-rails', '>= 2.11'
  gem 'capistrano', '>= 2.12'
  gem 'faker', '>= 1.0'
  gem 'rvm-capistrano'
end

group :test do
  gem 'rspec', '>= 2.11'
  gem 'webrat', '>= 0.7'
  gem 'spork-rails', '>= 3.2'
end

group :assets do
  gem 'sass-rails',   '>= 3.2.3'
  gem 'coffee-rails', '>= 3.2.1'
  gem 'compass-rails', '>= 1.0'
  gem 'execjs'
  gem 'therubyracer', :platforms => :ruby

  gem 'uglifier', '>= 1.0.3'
end

gem 'jquery-rails'
gem 'annotate'
gem 'excel_rails' #, '~> 0.3'
gem 'spreadsheet' #, '~> 0.7'
gem "schema_plus", :git => "git://github.com/lomba/schema_plus.git"
gem 'ar-octopus' #, '~> 0.3'
gem 'squeel' #, '~> 1.0'
gem 'devise' #, '~> 2.1'
gem 'role_model'
gem 'declarative_authorization'
gem 'rails-translate-routes'  #, '~> 0.1'
gem 'validates_timeliness'  #, '~> 3.0'

Here it is my (empty) app/assets/stylesheets/application.css.sass

/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets,
 * or vendor/assets/stylesheets of plugins, if any, can be referenced here using a relative path.
 *
 * 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.
 *
 */

I removed the following commented lines as per recommandation on https://github.com/rails/sass-rails :

 *= require_self
 *= require_tree .

my css.sass files are stored here :

app/assets/stylesheets/screen.css.sass
app/assets/stylesheets/partials/ (many partials files _*.css.sass referenced by screen.css.sass)

=== UPDATE ===

Please note I'm using COMPASS gem. So mixin and variables need to be shared between stylesheets.

Just in case, this is my app/assets/stylsheets/screen.css.sass file :

// This import applies a global reset to any page that imports this stylesheet.
@import blueprint/reset

// To configure blueprint, edit the partials/base.sass file.
@import partials/base

@import blueprint/interaction
@import blueprint/typography
@import blueprint/grid
@import blueprint/buttons
@import blueprint/utilities

@import compass/layout/grid-background
@import compass/typography/lists/inline-block-list
@import compass/typography/lists/horizontal-list
@import compass/utilities/general/float
@import compass/css3/border-radius
@import compass/css3/box-shadow
@import compass/css3/text-shadow
@import compass/css3/transition

@import partials/opf_mixins_et_functions
@import partials/link_icons
@import partials/typo
@import partials/application
@import partials/affichage_donnees
@import partials/tableau_edition
@import partials/page
@import partials/form
@import partials/feedback

=== UPDATE 2 ===

I realized that my Gemfile will lead me to trouble in production because I put the following Gems in the assets group :

group :assets do
  ...
  gem 'execjs'
  gem 'therubyracer', :platforms => :ruby
  ...
end

Because Production environnement as well needs a javascript interpreter... So I will move them outside of any group in my Gemfile.

Any advice welcome

Are you including your stylesheets on specific pages? Have you set your environment file to compile those stylesheets nested in your partials folders? — Benjamin, Mar 21 '13 at 19:55
I don't understand your questions. I got one rail's standard stylsheet : screen.css.sass wich reference partial stylsheets in app/assets/stylesheets partial directory. I didn't modified any environnement file. — Douglas, Mar 22 '13 at 11:14

score 1 · Answer 1 · answered Mar 21 '13 at 21:33

1

You're recommended to remove those two lines but you still need to include yourself your files :

*= require screen
*= require_dir partials/

Do note something, however : this doesn't work like @import - you won't get your mixins and variable shared. Use a real @import for that

answered Mar 21 '13 at 21:33

Ven

19,015
2
41
61

I thought sass-rail was following CoC (Convention over Configuration) rail's philosophy. Are you saying I do have to @import separately each of those : screen.css.sass, and all the partial stylsheets screen.css.sass is referencing to (in : app/assets/stylsheets/partials/) ? As I'm using COMPASS, I need mixins and variable to be shared. So sprocket "require screen" and "require_dir partials/" is forbidden for me. – Douglas Mar 22 '13 at 11:17
If you don't want to use the two directives you removed, yes you have. Or use application.css.scss and `@import` yourself :) – Ven Mar 22 '13 at 15:44

Douglas · Accepted Answer · 2013-03-23T06:50:56.540

0

OK I solved it with the following solution :

Following the spirit of the last answer, it appears that adding the following line at the end of my /app/assets/styelsheets/application.css.sass solved my issue :

@import screen

Every referenced partial stylesheet by screen.css.sass will then be automatically imported.

edited Mar 23 '13 at 06:50

answered Mar 22 '13 at 11:47

Douglas

5,229
3
43
54

score 0 · Answer 3 · answered Sep 14 '13 at 17:15

0

My precompiled assets (application.js and application.css) were empty ...

What solved the problem for me :

set the last rails version in Gemfile (3.2.14 for now)
bundle update
bundle install
restart the app touch tmp/restart.txt

answered Sep 14 '13 at 17:15

Steve Lng C

1,204
1
8
9

Why does rake assets:precompile produce an empty css stylesheet?

3 Answers3