Patternlab Gulpfile (alpha)

gulpfile.js

/* jshint node:true */
'use strict';

// Load Gulp
var gulp = require('gulp'),
    runSequence = require('run-sequence');

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

// Express Vars
var EXPRESS_PORT = 4000,
    EXPRESS_ROOT = __dirname + '/public',
    LIVERELOAD_PORT = 35729;

// Start Express
function startExpress() {
    var express = require('express');
    var app = express();
    app.use(require('connect-livereload')());
    app.use(express.static(EXPRESS_ROOT));
    app.listen(EXPRESS_PORT);
}

// Start Livereload
var lr;
function startLivereload() {
    console.log('Server started at http://localhost:' + EXPRESS_PORT);
    lr = require('tiny-lr')();
    lr.listen(LIVERELOAD_PORT);
}

function notifyLivereload(event) {
    gulp.src(event.path, {read: false})
          .pipe($.livereload(lr));
}

// Sets assets folders.
var dir = {
    source: 'source',
    js: 'source/js',
    js_public: 'public/js',
    sass: 'source/css',
    css_public: 'public/css',
    images: 'source/images',
    images_public: 'public/images',
    fonts: 'source/fonts',
    patterns: 'source/_patterns',
    patterns_public: 'public/patterns'
};

// Cleans public (except styleguide),
// "Who Are you?" "Scruffy, I am the janitor"
gulp.task('scruffy', function() {
	gulp.src(['public/**/*', '!public/styleguide/', '!public/styleguide/**/*', '!public/patterns/', 'public/patterns/*', '!public/data/', 'public/data/*'], { read: false })
		.pipe($.clean({ force: true }));
});

// Image optimazion
gulp.task('vanGogh', function(){
    // Optimize all images
    gulp.src(dir.images + '/*.{png,jpg,gif}')
        .pipe($.newer(dir.images_public))
        .pipe($.imagemin({
            optimizationLevel: 7,
            progressive: true
        }))
        .pipe(gulp.dest(dir.images));
});

// compiles the site
gulp.task('patterns', function() {
	gulp.src(['./'])
        .pipe($.exec('php core/builder.php -g'), {stdout: false});
});

gulp.task('jshint', function(){
    gulp.src( dir.js_public )
        .pipe( $.newer(dir.js_public) )
        .pipe( $.jshint() )
        .pipe( $.jshint.reporter('jshint-stylish') );
});

// generate css from sass
gulp.task('style', function() {
	gulp.src( dir.sass + '/*.scss')
		.pipe($.sass({
            outputStyle: 'nested',
            // includePaths : [dir.sass],
            errLogToConsole: true,
            sourceComments: 'map',
            onSuccess: function(css){
            },
            onError: function(error) {
                console.log(error);
            },
        }))
		.pipe($.csslint('gulp_config/.csslintrc'))
		.pipe($.csslint.reporter())
        .pipe($.autoprefixer("last 1 version", "> 1%", "ie 8", "Android 4", "iOS 6"))
  //       .pipe($.uncss({
		// 	html: [dir.patterns_public]
		// }))
		.pipe(gulp.dest(dir.css_public));
});

gulp.task('watch', function() {
    startExpress();
    startLivereload();

    // Watch Patterns
    gulp.watch( [
        dir.js_public + '/**/*.js',
        dir.images_public + '/**',
        dir.css_public + '/**/*.css',
        dir.patterns_public + '/**/*.html'
    ], notifyLivereload);


    gulp.watch(dir.patterns + '/**/*.mustache' , function(){
        runSequence('scruffy', 'style','patterns');
    });

    // Watch JavaScript changes.
    gulp.watch(dir.js + '/**/*.js', ['jshint']);

    // Watch SCSS changes.
    gulp.watch(dir.sass + '/**/*.scss', ['style']);

    // optimize images
    // gulp.watch(dir.images, ['vanGogh']);
});

gulp.task('default', ['scruffy'] , function(){
    // ['scruffy', 'patterns', 'style', 'jshint', 'vanGogh']
    runSequence('patterns', 'style', 'jshint');
});