Gulp-sass: gulp.dest - specific .css file for output instead of directory

Created on 26 Jan 2014 · 6Comments · Source: dlmanning/gulp-sass

Just noticed this while trying to integrate Gulp into a WordPress theme I'm building. Can't output my .scss into the _required_ style.css file in the theme's root. Not sure if I'm missing something, but this kind of functionality seems necessary.

Ex:

gulp.task('sass', function() {
  gulp.src('./scss/*.scss')
      .pipe(sass())
      .pipe(gulp.dest('style.css'));
});

Source

cmegown

Most helpful comment

Ok finally got a chance to look at this. You are, of course, correct. Here's what I ended up with in case anyone else comes across this looking for the same thing:

gulp.task('sass', function() {
  gulp.src('./scss/*.scss')
      .pipe(sass())
      .pipe(concat('style.css')) // this is what was missing
      .pipe(gulp.dest('./')); // output to theme root
});

Thanks for your help @dlmanning!

cmegown on 28 Jan 2014

👍23 🎉3

All 6 comments

You want to pipe the result of gulp-sass into gulp-concat to concatenate them together into a single file.

dlmanning on 27 Jan 2014

👍3

Thanks for responding, I'll check this out as soon as I get a chance and report back.

cmegown on 27 Jan 2014

Ok finally got a chance to look at this. You are, of course, correct. Here's what I ended up with in case anyone else comes across this looking for the same thing:

gulp.task('sass', function() {
  gulp.src('./scss/*.scss')
      .pipe(sass())
      .pipe(concat('style.css')) // this is what was missing
      .pipe(gulp.dest('./')); // output to theme root
});

Thanks for your help @dlmanning!

cmegown on 28 Jan 2014

👍23 🎉3

Great!

dlmanning on 28 Jan 2014

@cmegown thanks!