I am trying to use foundation sites in my project so I downloaded it using bower.
I have a gulp.config.js file which has the following code:
module.exports = function() {
// PATHS TO JS AND SASS
var GETPATHS = {
VENDOR: [
'bower_components/jquery/dist/jquery.min.js'
],
JS: [
'bower_components/foundation-sites/js/foundation.core.js',
'src/assets/**/*.js'
],
SASS: [
'bower_components/foundation-sites/scss',
'src/assets/scss/components'
]
}
return GETPATHS;
}
and my gulpfile itself has this (SASS):
gulp.task('sass', function() {
return gulp.src('src/assets/scss/app.scss')
.pipe(sass({ includePaths: config.SASS }))
.pipe(autoprefixer())
.pipe(cssnano())
.pipe(gulp.dest('_build/assets/css'))
.pipe(browserSync.stream());
});
and here's my app.scss file
@import "foundation";
Now, the problem is I don't know why app.css (after getting compiled) is showing an empty file. The import "foundation" doesn't seem to work. Any help is appreciated as I am quite new to this. Thanks!