JustinCann
4/6/2018 - 4:35 PM

Gulp Recipes

var gulp        = require('gulp');
var $           = require('gulp-load-plugins')();


var sassPaths = [
  './bower_components/normalize.scss/sass',
  './bower_components/foundation-sites/scss',
  './bower_components/font-awesome/scss',
  './bower_components/motion-ui/src'
];

var paths = {
  sassPaths:  sassPaths,
  sassFiles:  './sass/*.scss',
  jsFile:  './js/app.js',
};

// var lessToScss = require('gulp-less-to-scss');
// gulp.task('lessToScss',function(){
//     gulp.src('./sass/sliderless/*.less')
//         .pipe(lessToScss())
//         .pipe($.rename({ prefix: '_' }))
//         .pipe(gulp.dest('./sass/slider/'));
// });


// concatenate universal js files into one
gulp.task('uglify-js', function() {
    return gulp.src(paths.jsFile)
        .pipe($.rename({ suffix: '.min' }))
        .pipe($.uglify())
        .pipe(gulp.dest('./js/'));
});

gulp.task('sass', function() {
  return gulp.src('./sass/app.scss')
    .pipe($.sass({
      includePaths: sassPaths,
    })
    .on('error', $.sass.logError))
    .pipe($.autoprefixer({
      browsers: ['last 2 versions', 'ie >= 9']
    }))
    .pipe(gulp.dest('./css'))
    .pipe($.sass({
        includePaths: sassPaths,
        outputStyle: 'compressed' // if css compressed **file size**
    })
    .on('error', $.sass.logError))
    .pipe($.rename({suffix: '.min'}))
    .pipe(gulp.dest('./css'));
});

gulp.task('flexslider', function() {
  return gulp.src('./sass/flexslider.scss')
    .pipe($.sass({
      includePaths: sassPaths,
    })
    .on('error', $.sass.logError))
    .pipe($.autoprefixer({
      browsers: ['last 2 versions', 'ie >= 9']
    }))
    .pipe(gulp.dest('./css/vendor'))
    .pipe($.sass({
        includePaths: sassPaths,
        outputStyle: 'compressed' // if css compressed **file size**
    })
    .on('error', $.sass.logError))
    .pipe($.rename({suffix: '.min'}))
    .pipe(gulp.dest('./css/vendor'));
});

gulp.task('iframe-sass', function() {
  return gulp.src('./sass/iframe.scss')
    .pipe($.sass({
      includePaths: sassPaths,
      // outputStyle: 'compressed' // if css compressed **file size**
    })
      .on('error', $.sass.logError))
    .pipe($.autoprefixer({
      browsers: ['last 2 versions', 'ie >= 9']
    }))
    .pipe(gulp.dest('./css'));
});


gulp.task('default', ['sass', 'uglify-js'], function() {
  gulp.watch(['./sass/*.scss'], ['sass']);
  gulp.watch([paths.jsFile], ['uglify-js']);
  // gulp.watch(['./sass/iframe.scss'], ['iframe-sass']);
});