How to use Foundation 5 with Compass+SASS?

compass-sass, zurb-foundation

Solution

You need to change the line `foundation new MY_PROJECT` by replacing `MY_PROJECT` with the folder you want to install the project on. After that, confirm that these folders exist on the directory you specified above - "bower_components/foundation/scss"

When starting a project run `compass init` and then `compass watch` (in Terminal) to watch for changes on the `.sass` files.

Personally, I don't go that route and use http://koala-app.com/ to convert or "compile" my Sass. It's FREE and awesome.

Problem

The problem Foundation 5 was released last week, that's great, but the new version requires to use bower for using F5 with SASS and the official documentation seems to be a bit incomplete and immature. I'm trying to create a project using the steps proposed by the docs: ``` [sudo] npm install -g bower ``` and then ``` gem install foundation ``` No problems here. The problem is when creating a Compass project: ``` foundation new MY_PROJECT cd MY_PROJECT compass compile ``` After Compass compilation, I get the following error: ``` directory stylesheets/ error scss/app.scss (Line 1: File to import not found or unreadable: settings. Load paths: /home/cartucho/MY_PROJECT/scss /var/lib/gems/1.9.1/gems/compass-0.12.2/frameworks/blueprint/stylesheets /var/lib/gems/1.9.1/gems/compass-0.12.2/frameworks/compass/stylesheets /home/cartucho/MY_PROJECT/bower_components/foundation/scss Compass::SpriteImporter) create stylesheets/app.css ``` Compass config file (`config.rb`): ``` # Require any additional compass plugins here. add_import_path "bower_components/foundation/scss" # Set this to the root of your project when deployed: http_path = "/" css_dir = "stylesheets" sass_dir = "scss" images_dir = "images" javascripts_dir = "javascripts" ``` The SASS file (`app.sass`): ``` @import "settings"; @import "foundation"; ... ``` The problem seems to be in `config.rb`: ``` add_import_path "bower_components/foundation/scss" ``` because Compass fail trying to import the files `settings` and `foundation` but I don't know how to fix it. Any help will be highly appreciated. Thanks.

Original source

Related problems