SASS global variables not being passed to partials

Question

Basically I have a structure that used to work perfectly in 3.0.x and now it breaks with undefined variable errors.

• partials
  • _base.css.sa

Answer 1

Apparently you HAVE to use the application.css.sass as a manifest, or nothing will work.

Basically you can separate everything but they need to be called from the application file because the scopes are not shared.

Little bit too enforcing if you ask me...

Answer 2

It's a sass file. Use @import in application.css.sass instead of require. require is for plain css or template engines that don't have an import system.

Answer 3

You can't use //=require to include "dynamic" SASS stuff like mixins and variables, because that's used just for including the most "static" stuff (like pure CSS). You have to @import all your files in application.css.sass. Railscasts provides good explanation of this in episode #268.

Answer 4

There is a simple solution for the original topic. Your application and main css files should be scss files. That means you can use the known syntax:

/*
 *= require_self
 *= require main
 */

In main.scss you can import the partials like this:

@import 'partials/base'
@import 'partials/header'

These files are sass files and you can benefit from the greatness of SASS ;-)

Answer 5

I think I had the same problem and what helped was declaring the variables before @imports. Hope this helps someone =).