nanoc Integration

crazysim edited this page Apr 8, 2013 · 1 revision

Minimal integration: just drop it in

One simple route for lightweight integration is to simply install compass inside nanoc. Then edit config.rb to point to the stylesheets you want to use. This means you have to have the Compass watch command running in a separate window from the Nanoc compilation process.

Example project that works this way: http://github.com/unthinkingly/unthinkingly-blog

More formal integration

At the top of the Nanoc Rules file, load the Compass configuration, like

require 'compass'

Compass.add_project_configuration 'compass/config.rb' # when using Compass 0.10
Compass.configuration.parse 'compass/config.rb'       # when using Compass < 0.10

Your Compass configuration file (in compass/config.rb) could look like this (you may need to change the path to some directories depending on your directory structure):

http_path    = "/" 
project_path = "." 
css_dir      = "output/assets/style" 
sass_dir     = "content/assets/style" 
images_dir   = "output/assets/images"

# when using SCSS:
sass_options = {
  :syntax => :scss
}

To filter the stylesheets using Sass and Compass, call the sass filter with Sass engine options taken from Compass, like this:

filter :sass, Compass.sass_engine_options

If you are using nanoc's built-in autocompiler, following the above will result in eventual stack-busting errors. This is the result of reloading Compass's configuration upon every reload. To prevent this, use this snippet instead of the plain add_project_configuration to ensure the configuration is only loaded once.

unless defined? LOADED_DEFAULT_CONFIG
  LOADED_DEFAULT_CONFIG = true
  require 'compass'
  Compass.add_project_configuration 'compass/config.rb' 
end

Nanoc Projects using the formal approach