gulpfile.js

var gulp        = require("gulp");
var loadPlugins = require('gulp-load-plugins');
var $           = loadPlugins();
var browserSync = require("browser-sync");


// base config
var paths = {
  vhost:  "***********",
  cmnDir: "htdocs/cmn/",
  html:   "htdocs/**/*.html",
  php:    "htdocs/**/*.php",
};

// base src
var src = {
  scssSrc: paths.cmnDir + "scss/*.scss",
  jsSrc:   paths.cmnDir + "js/*.js",
  imgSrc:  paths.cmnDir + "img/**/*",
  cssSrc:  paths.cmnDir + "css/*.css"
};

// setting prefix browsers
var prefixBrowsers = [
  'ie >= 8',
  'ie_mob >= 8',
  'ff >= 30',
  'chrome >= 34',
  'safari >= 7',
  'opera >= 23',
  'ios >= 6',
  'android >= 4.4',
  'bb >= 10'
];

// setting server
gulp.task("bs-init", function() {
    browserSync.init(null, {
    proxy:  paths.vhost,
    port:   1043, // Port 1024 ~ 65535
    // tunnel: paths.vhost,// Option : true, false, paths.vhost
    logPrefix: paths.vhost,// Console logging prefix
    notify: true,
    open:   false, // Option : true, false, "external", "tunnel"
    ghostMode: {
      clicks:   true,
      location: true,
      forms:    true,
      scroll:   true
    }
  });
});

// error notify
function plumberWithNotify(){
    return $.plumber({errorHandler: $.notify.onError("<%= error.message %>")});
}

// browser sync
gulp.task("bs-reload", function() {
    browserSync.reload();
});

// file cached
function cached(){ return $.cached();}

// gulp-using
function using(){ return $.using();}

// gulp-remember
function remember(){ return $.remember();}

// setting sass
gulp.task('sass', function () {
    return gulp.src(src.scssSrc)
    .pipe(plumberWithNotify())
    .pipe(cached())
    // .pipe(using())
    .pipe(remember())
    .pipe($.rubySass({
        style:           "compressed", //Output Style = n ested, expanded, compact, compressed
        lineNumbers:      false,
        precision:        10,
        "sourcemap=none": true
    }))
    .pipe($.autoprefixer({
        autoprefixer: { browsers: prefixBrowsers}
    }))
    .pipe(gulp.dest(paths.cmnDir + "css"))
    .pipe(browserSync.reload({ stream: true}));
});


gulp.task('scripts', function() {
  return gulp.src([
      paths.cmnDir + 'js/jquery.easing.1.3.min.js',
      paths.cmnDir + 'js/owl.carousel.min.js',
      paths.cmnDir + 'js/common.js'
    ])
    .pipe($.concat('all.min.js'))
    .pipe($.uglify())
    .pipe(gulp.dest(paths.cmnDir +'js/'))
    .pipe(browserSync.reload({ stream: true}));
});


// file watch
gulp.task('watch', function () {
    gulp.watch(paths.cmnDir + "scss/**/*.scss", ["sass"]);
    gulp.watch(paths.cmnDir + "js/**/*.js", ["scripts"]);
    gulp.watch([paths.html, paths.php, src.jsSrc, src.imgSrc, src.cssSrc], ['bs-reload']);
});

// gulpfile watch
var spawn = require('child_process').spawn;
    gulp.task('default', function() {
        var process;
        function restart() {
            if (process) {
              process.kill();
            }
            process = spawn('gulp', ['default-task'], {stdio: 'inherit'});
        }
    gulp.watch('gulpfile.js', restart);
    restart();
});


// default task
gulp.task("default-task", [
    "bs-init",
    "sass",
    "scripts",
    "watch",
    "bs-reload"
]);