Gulp-sass not compiling Foundation 6 properly

Question

I'm having some issues with Foundation 6 files, for some reasons they are just not including all of the sass components. I tried to use Foundation 5 and it worked fine.

Here is my gulp task:

gulp.task('styles', ['clearCss'], function() {
    gulp.src('assets/sass/app.scss')
        .pipe(plumber(plumberErrorHandler))
        .pipe(sourcemaps.init())
        .pipe(sass({
            outputStyle: 'compressed'
        })
        .on('error', notify.onError(function(error) {
            return "Error: " + error.message;
        }))
        )
        .pipe(autoprefixer({
            browsers: ['last 2 versions', 'ie >= 9']
        }))
        .pipe(sourcemaps.write('.'))
        .pipe(gulp.dest('./assets/dist/css')) 
        .pipe(browserSync.stream({match: '**/*.css'}))
        .pipe(notify({
            message: "Styles task complete!"
        }));
});

And here is my app.scss:

// Import Foundation
@import "../components/foundation/scss/foundation";

It works with my own sass files, but completely ignoring foundation parts.

Answer 1

You should import a file foundation-sites.scss, not scss/foundation.scss. File foundation.scss has only a @mixin foundation-everything which is included in foundation-sites.scss:

@include foundation-everything;

However foundation-sites.scss has an error in 6.0.4, this is my log:

Error in plugin 'sass'
Message:
    bower_components\foundation-sites\foundation-sites.scss
Error: File to import not found or unreadable: foundation
       Parent style sheet: stdin
        on line 1 of stdin
>> @import 'foundation';

The fix:

Change line nr 1 in file foundation-sites.scss from @import 'foundation'; to @import 'scss/foundation';