Menu icon Foundation
Foundation 6 SCSS Issue

I am setting up a new projected and ran into an issue with the SCSS not compiling.

I have my app.scss set up which has the following:

@import "setting/settings";
@import "foundation";

What seems to happen is that the normalize.scss compiles but the util and on do not. Nor does any adjustments made in the _settings.scss file.

I am using Koala, not the CMD line, which worked fine with Foundation 5 as of last week. I also do not get any errors.

Thanks in advance.

foundation 6scss

I am setting up a new projected and ran into an issue with the SCSS not compiling.

I have my app.scss set up which has the following:

@import "setting/settings";
@import "foundation";

What seems to happen is that the normalize.scss compiles but the util and on do not. Nor does any adjustments made in the _settings.scss file.

I am using Koala, not the CMD line, which worked fine with Foundation 5 as of last week. I also do not get any errors.

Thanks in advance.

Julian Ćwirko almost 4 years ago

You should also include Foundation components or everything according the docs: http://foundation.zurb.com/sites/docs/sass.html#adjusting-css-output You should have something like:

@import "setting/settings"; 
@import "foundation";

@include foundation-everything;

or you can chose only what you need like:

@import "setting/settings"; 
@import "foundation";

@include foundation-global-styles;
@include foundation-grid;
@include foundation-typography;
@include foundation-button;
@include foundation-forms;
// And so on...

Forrest Salisbury almost 4 years ago

Ah got it, I get an error using:

@include foundation-everything;

as follows:

NoMethodError: undefined method `specificity' for &:Sass::Selector::Parent
Use --trace for backtrace.

Apart from that, I misunderstood what I was reading, believing that @import "foundation" pulled everything in.

Thanks for your assistance!

Rafi Benkual almost 4 years ago

I think the imports should be

@import 'settings';
@import 'foundation';
@import 'motion-ui';

We're not using Normalize on F6. Are you using Foundation 6? I think maybe Koala is not pulling the new version but I'm not familiar with how it works.

Forrest Salisbury almost 4 years ago

I am currently using the following:

@import "settings/settings";

@import "foundation";

@include foundation-global-styles;
@include foundation-grid;
@include foundation-typography;
@include foundation-button;
@include foundation-forms;
etc....

The only issue I am having know is regarding the @include foundation-media-object; which causes the compiler to return an error.

NoMethodError: undefined method `specificity' for &:Sass::Selector::Parent
Use --trace for backtrace.

This caused the foundation-everything to not compile. Once i removed it the rest of the includes were fine.

Julian Ćwirko almost 4 years ago

You should probably check which version of node Sass you are running...

by the way... is it true that Foundation 6 don't need normalize css? So why there is a normalize.scss in the repo here: https://github.com/zurb/foundation-sites/tree/develop/scss/vendor and why not use normalize?

Ronald Nunez almost 4 years ago

@Forrest Salisbury I am also using Koala as I get lost on the CLI.
Go to Setting->SASS and on system settings check system sass compiler and the path to your sass.bat
You must install ruby and add sass gem