gulp
Utilizando filtros de archivos.

Creación de reglas de Imágenes, JS y CSS (SASS) para ordenar archivos

Instalación de Gulp y sus tareas

$ npm install gulp --save-dev
$ npm install gulp-sass --save-dev
$ npm install gulp-uglify --save-dev
$ npm install gulp-imagemin --save-dev

Determinar la estructura de la carpeta

En esta estructura, utilizaremos la carpeta de la aplicación para fines de desarrollo, mientras que la carpeta dist se utiliza para contener archivos optimizados para el sitio de producción.

|-app
    |-css/
    |-images/
    |-index.html
    |-js/
    |-scss/
|- dist/
|- gulpfile.js
|- node_modules/
|- package.json

Preproceso de Gulp

// Requires the gulp-sass plugin
var gulp = require('gulp'); 
    sass = require('gulp-sass');
    uglify = require('gulp-uglify');
    imagemin = require('gulp-imagemin');

Gulp Task

gulp.task('sass', function(){
  return gulp.src('app/scss/**/*.scss') //selection all files in this derectory
    .pipe(sass()) // Using gulp-sass
    .pipe(gulp.dest('dist'))
});
gulp.task('gulp-uglify', function(){
  return gulp.src('app/js/*.js')
    // Minifies only if it's a JavaScript file
    .pipe(uglify())
    .pipe(gulp.dest('dist'))
});
gulp.task('images', function(){
  return gulp.src('app/images/**/*.+(png|jpg|gif|svg)')
  .pipe(imagemin())
  .pipe(gulp.dest('dist/images'))
});

Gulp Watch

gulp.task('watch', function(){
  gulp.watch('app/js/**/*.js', ['gulp-uglify']); 
    gulp.watch('app/scss/**/*.scss', ['sass']);
    gulp.watch('app/images/**/*.*', ['images']);  
  // Other watchers
});
gulp.task('build', [`sass`, `gulp-uglify`, `images`], function (){
  console.log('Building files');
});
gulp.task('default', function() {});