darkojergovic
6/13/2015 - 6:05 PM

Gulp config with expressive path variables

Gulp config with expressive path variables

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

var paths = {
  sassEntryPointFile: './scss/main.scss',
  sassInputFiles: ['./scss/**/*.scss'],
  cssOutputFolder: './css/',
  htmlInputFiles: ['./manage/**/*.html']
};

gulp.task('default', ['connect', 'sass', 'watch']);

gulp.task('connect', function () {
  connect.server({
    root: './',
    port: 8000,
    livereload: true
  });
});

gulp.task('sass', function (done) {
  gulp.src(paths.sassEntryPointFile)
    .pipe(sass({sourcemap: 'inline'}))
    .pipe(gulp.dest(paths.cssOutputFolder))
    .on('end', done);
});

gulp.task('watch', function() {
  gulp.watch(paths.sassInputFiles, ['sass']);
  gulp.watch(paths.htmlInputFiles, ['reload']);
  gulp.watch(paths.cssOutputFolder, ['reload']);
});

gulp.task('reload', function () {
  gulp.src(paths.htmlInputFiles)
    .pipe(connect.reload());
});