Gulp watch all files but render only one (sass)

问题:

I want to make gulp watch for all changes on my work folders but to generate only one file. Because I use scss which imports all required files, there is no need to compile all .css files, only main one.

Now, my gulpfile.js contains:

var gulp    = require('gulp');
var util    = require('gulp-util');
var sass    = require('gulp-sass');

gulp.task('sass', function () {
  return gulp.src('./sass/style.scss')
  .pipe(sass().on('error', sass.logError))
  .pipe(gulp.dest('./dist/css'));
});

gulp.task('watch', function() {
  gulp.watch('./sass/**/*.scss', ['sass']);
});

And I have to go in ./sass/style.scss and save it to triger gulp watch.

I want gulp to watch all files (something like ./**/*.scss) but to render only one - ./sass/style.scss. How to achieve that?

回答1:

Solution to this is simple, just edit watch part of the gulpfile.js to:

gulp.task('watch', function() {
  gulp.watch('./**/*.scss', ['sass']);
});

Which says: watch for all .scss and on change run 'sass' taks.

'sass' taks compiles only ./sass/style.scss'