Foundation Variables and Mixins Not Working Correctly

问题

I have Foundation installed with Bower, and I'm including the path in my gulp task like so:

.pipe(sass({
    includePaths: [
        'bower_components/foundation/scss'
    ],
    outputStyle: 'expanded'
})

When I @import 'foundation'; into my stylesheet it seems to work fine. But when I start to reference its SASS variables or mixins I start getting errors like the one below:

Error: unbound variable $medium-up

Any idea why this is happening?

Thanks in advance!

回答1:

You need to @import 'foundation/settings'; before @import 'foundation';. As far as I can see, the main file that you are importing does not include settings.

Take a look at the app.scss section in this doc.

回答2:

the trick is to import settings.SCSS file in the bottom of global.scss. Works perfect for me

来源：https://stackoverflow.com/questions/29351726/foundation-variables-and-mixins-not-working-correctly