2

I searched and found these Background images path in Sass and Compass, Multiple Background Images using Sass / Compass, Sass background images

Please bear with me since I am new to Gulp. I don't have a separate config.rb file and I set everything up in gulpfile.js. Here is what I have

compass = require('gulp-compass');

gulp.task('compass', function(){
    gulp.src(sassSources)
    .pipe(compass({   // loading config without config.rb
    sass: '1_components/sass', 
    style: 'expanded',
    image: '2_builds/development/images'
}))
    .on('error', gutil.log)  
    .pipe(gulp.dest('2_builds/development/css')) 
    .pipe(connect.reload()) 
});

gulp.task('watch', function(){
    gulp.watch(jsSources, ['js']);
    gulp.watch('1_components/sass/*.scss', ['compass']); 
    gulp.watch(htmlSources, ['html']);
});

and in Sass file when I type

#section0, #emptyAttach {
    @include background (linear-gradient(center left, rgba(0, 0, 0, .6), rgba(0, 0, 0, .1)), image-url('second.png')); 
}

it is not picking an image from a given directory. I would highly appreciate if someone could give me a complete explanation how to set up background image in Gulp using Sass.

Community
  • 1
  • 1
code4life
  • 31
  • 4

0 Answers0