Question

So we’ve got a standard Compass CSS project, with the sass and css directories. As a scenario, let’s say that the .scss file is called foo-all.scss.

Is it possible, via command line or config.rb or any other means, to have Compass generate both a foo-all.css file, using the “compressed” style, and also a foo-all-debug.css file using the “expanded” style?

It seems to me like Compass will refuse to generate a CSS file that doesn’t have the exact same name as the .scss file, and that the most you can do is specify which directory the CSS file gets generated to.

Answer 1

This seems like somewhat of a deficiency in Compass. Is this really an uncommon thing to do? Regardless, here’s what I went with. Let’s say that the folder structure is like this:

Rakefile
/foo
    /resources
        /css
            /debug
        /sass
            foo-all.scss

And then in the Rakefile, to generate both compressed and expanded version, I do this:

Dir.chdir "foo/resources/sass" do
    # Compile both expanded and compressed variations
    debugdir = File.join(File.dirname(__FILE__), 'foo/resources/css/debug')

    sh "compass compile --output-style compressed --force"
    sh "compass compile --output-style expanded --force --css-dir #{debugdir}"
    mv "../css/debug/foo-all.css", "../css/foo-all-debug.css"
end

In essence, I generate the compressed CSS file in a separate /debug directory, and then move it up to the /css directory, to preserve URL paths in the CSS file. The debudir shenanigans are necessary because Compass seems to require an absolute path when using the -css-dir switch (on Windows, anyway).