example.style.gulpfile.js

var gulp = require('gulp');
var postcss = require('gulp-postcss');
var inject = require('gulp-inject');
var watch = require('gulp-watch');
var clean = require('gulp-clean');
var concat = require('gulp-concat');
var cssnext = require('cssnext');
var csswring = require('csswring');
var browserSync = require('browser-sync');
var prefix = require('autoprefixer');
var nested = require('postcss-nested');

// clean files in dir
gulp.task('clean', function () {
    return gulp.src('./dist')
            .pipe(clean());
});

gulp.task('style', ['clean'], function () {
    
    var processors = [cssnext, csswring, prefix, nested];

    return gulp.src('./dev/*.css')
        .pipe(postcss(processors))
        .on('error', function(){
            this.emit('end');
        })
        .pipe(concat('responself.min.css'))
        .pipe(gulp.dest('./dist'));
});

// Live reload page
gulp.task('style-watch', ['style'], browserSync.reload);

// Inject style in HTML
gulp.task('inject-style', function () {
    var target = gulp.src('./index.html');
    var source = gulp.src(['./dist/*.css'], {read: false})
    return target.pipe(inject(source))
        .pipe(gulp.dest('./'));
});

// Server
gulp.task('serve', ['style', 'inject-style'], function () {

    browserSync.init({
        server: {
            baseDir: './'
        }
    });

    gulp.watch('./*.html').on('change', browserSync.reload);
    gulp.watch('./dev/*.css', ['style-watch']);

});

// Default
gulp.task('default', ['serve']);