I have made a subtheme of zen and started making some changes to it's SASS files. However now I have some layouts that aren't working as I expected, so I went to the chrome devtools, but that only tells me what CSS file the particular thing is in.

What I want is what SASS file it is in. Now, when I read the config.rb file it says it has some support for FireSass, but that plugin has been removed by the author, so no luck there.

I do have the environment set to :development and the firesass = true, therefore the sass_options :debug_info => true.

So I go to the root in the theme file /sites/all/themes/mytheme and run compass watch, but there are never any source maps.


3 Answers 3


I think this issue: https://www.drupal.org/node/2295227 addresses your question.

Though haven't tried it myself, but the current dev-version of Zen should contain the 'fix' (i.e., using FireCompass instead of FireSass) to debug SASS-code in an easy way.

  • That just is a replacement for FireSass, which is useful but doesn't solve the problem I was having in te first place. Not generating source maps ;)
    – Noë
    Apr 5, 2015 at 12:05
  • @Noë, ok sorry, misunderstood your question.. Thought you were trying to debug your SASS with FireSass.
    – Watergate
    Apr 5, 2015 at 12:17

I had to give the sass_options en extra element { :sourcemaps => true } this solves the problem. A demo about how to do just that can be found here: http://cgit.drupalcode.org/zen/tree/STARTERKIT/config.rb?id=8ffd0ac18b51b7a01f2c6019882adb1cb044b340

Don't know why this isn't in Zen 5.5 though.


Try updating Compass, best way is to just update your ruby gems, worked for me.

gem update

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.