css - Sass-gulp error importing whole directory -

i'll start saying i've looked hours , haven't found solution works me. i'm trying away compass , switch sass company's website, , i'm running issue sass doesn't recognize directories; "file not found or unreadable" error.

i've tried compile using vanilla sass, gulp-sass, , gulp-ruby-sass, , exact same error on of them. here's folder structure:

- css - sass   - variables      - _colors.scss      - _type.scss   (... etc.)   - abstractions   - base   - components - gulpfile.js 

my styles.scss file looks (there's bunch of comments @ top):

@import "variables/**/*"; @import "abstractions/**/*"; @import "base/**/*"; @import "components/**/*"; 

and gulpfile.js looks this:

var    gulp = require('gulp'),        sass = require('gulp-sass');  gulp.task('sass', function() {   gulp.src('sass/**/*.scss')     .pipe(sass().on('error', sass.logerror))     .pipe(gulp.dest('./css/')); });   gulp.task('default', ['sass'], function() {   gulp.watch("sass/**/*.scss", ['sass']); }); 

the exact error is:

error sass/lgfcu.styles.scss (line 23: file import not found or unreadable: variables/**/*.) 

i've tried using "includepaths" gulp-sass , no luck there. i've tried playing paths: ./variables/**/*, variables/**/*.scss, etc.

if include full path specific file, work, globbing not working. appreciated!

i had same problem using gulp-sass. if want import entire directory have add gulp-sass-bulk-import.

you can installing project below:

npm install --save-dev gulp-sass-bulk-import

then inside gulpfile.js:

var gulp = require('gulp'),     sass = require('gulp-sass'),     bulksass = require('gulp-sass-bulk-import');  gulp.task('sass', [], function() {     gulp.src( 'sass/**/*.scss' )         .pipe( bulksass() )         .pipe( sass().on('error', sass.logerror) )         .pipe( gulp.dest( './css/' )); }); 

make sure using correct package handling sass files:

npm install --save-dev gulp-sass

there package gulp-ruby-sass not work above script, although handy.

enjoy.