Compass different css output path and url helpers

Question

I've got a problem with different .css output path (to specific file) in compass project.

Let's say I've got directory tree like this:

 /
 ..Fonts
 ..Folder
 ..Images
 ..Sass
   .._mixins.scss
   ..[other_stuff]
 ..Styles
 ..config.rb

This is my config.rb:

http_path = "/"
css_dir = "Styles"
sass_dir = "Sass"
images_dir = "Images"
javascripts_dir = "Scripts"
fonts_dir = "Fonts"

output_style = :nested
relative_assets = true
color_output = false

Goal

I need to use sass inside "Folder" dir, I mean some example.scss file has to be compiled into example.css inside "Folder". But, I have to use compass with relative url helpers and some mixins defined in "Sasss/_mixins.scss" file.

Problem

The problem is, I can't specify different output path for example.scss, because output path for scss is specified in config.rb (Styles), right? Ok, so I tried adding ruby code to config.rb in order to move example.css after it is compiled from "Styles" dir to "Folder" dir like this:

require 'fileutils'
on_stylesheet_saved do |file|
  if File.exists?(file) && File.basename(file) == "example.css"
    puts "Moving: #{file}"
    FileUtils.mv(file, File.dirname(file) + "/../Folder/" + File.basename(file))
  end
end

BUT, now relative image-url() does not work properly, because it was compiled in "Styles" dir, thus url is relative to this directory not the "Folder" one.

Solution?

So my question is: what is the best possible way or hack to achieve this?

Answer 1

The only graceful solution is to move your Galleria sub-project into a separate project. You actually have two projects, why are you trying to manage them as one? Instead, keep them separated and put them together during deployment.

Alternatively, create a Compass extension out of the sub-project (if its structure and amount of changes you make in it allow that) and inject necessary stuff into your main project by importing it (directly or via mixins).

One dirty solution is to use symbolic links:

cd Styles
ln -s ../Folder Folder

And then create Sass/Folder/foo.sass.

But this makes compass compile go crazy and recreate your whole project every time (rather than overwriting only modified files).

You can also try creating symbolic links in the opposite direction, but you have to make sure your web server allows following symbolic links