Simple WordPress with Gulp

gulpfile.js

var gulp = require('gulp');
var browserSync = require('browser-sync');
var sass = require('gulp-sass');
var sourcemaps = require('gulp-sourcemaps');
var autoprefixer = require('gulp-autoprefixer');
var cleanCSS = require('gulp-clean-css');
var imagemin = require('gulp-imagemin');
var changed = require('gulp-changed');
var del = require('del');
var sequence = require('run-sequence');
var sassGlob = require('gulp-sass-glob');
var browserify = require('browserify');
var source = require('vinyl-source-stream');

// replace YOUR_THEME with a real theme name

var config = {
  dist: 'wp-content/themes/YOUR_THEME/dist/',
  src: 'wp-content/themes/YOUR_THEME/src/',
  jsin: 'wp-content/themes/YOUR_THEME/src/js/**/*.js',
  jsinroot: 'wp-content/themes/YOUR_THEME/src/js/app.js',
  jsrootvendor: 'wp-content/themes/YOUR_THEME/src/js/vendor/*.js',
  imgin: 'wp-content/themes/YOUR_THEME/src/img/**/*.{jpg,jpeg,png,gif}',
  scssin: 'wp-content/themes/YOUR_THEME/src/scss/**/*.scss',
  phpin: 'wp-content/themes/YOUR_THEME/**/*.php',
  jsout: 'wp-content/themes/YOUR_THEME/dist/js/',
  imgout: 'wp-content/themes/YOUR_THEME/dist/img/',
  scssout: 'wp-content/themes/YOUR_THEME/',
  jsoutname: 'script.js'
};

gulp.task('reload', function () {
  browserSync.reload();
});

gulp.task('serve', ['sass', 'img', 'js'], function () {
  browserSync({
    proxy: {
      target: 'http://YOUR_LOCAL_DOMAIN.test' // can be http://localhost or http://localhost/projectname, etc
    },
    ghostMode: false,
    online: true
  });

  gulp.watch([config.phpin, config.jsin], ['reload']);
  gulp.watch(config.scssin, ['sass']);
  gulp.watch(config.imgin, ['img']);
  gulp.watch(config.jsin, ['js']);
});

gulp.task('sass', function () {
  return gulp.src([config.scssin])
    .pipe(sourcemaps.init())
    .pipe(sassGlob())
    .pipe(sass({includePaths: ['node_modules']}).on('error', sass.logError))
    .pipe(autoprefixer({
      browsers: ['last 3 versions']
    }))
    .pipe(sourcemaps.write())
    .pipe(cleanCSS())
    .pipe(gulp.dest(config.scssout))
    .pipe(browserSync.stream());
});

gulp.task('js', function () {
  return browserify(config.jsinroot)
    .transform("babelify")
    .transform("uglifyify")
    .bundle()
    .pipe(source(config.jsoutname))
    .pipe(gulp.dest(config.jsout));
});

gulp.task('img', function () {
  return gulp.src(config.imgin)
    .pipe(changed(config.imgout))
    .pipe(imagemin())
    .pipe(gulp.dest(config.imgout));
});


gulp.task('clean', function () {
  return del([config.dist]);
});

gulp.task('build', function () {
  sequence('clean', ['js', 'sass', 'img']);
});

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

package.json

{
  "name": "gulp-starter-kit",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [
    "gulp"
  ],
  "author": "Marcin Krzemiński",
  "license": "ISC",
  "devDependencies": {
    "babel-core": "^6.26.0",
    "babel-preset-es2015": "^6.24.1",
    "babelify": "^7.3.0",
    "browser-sync": "^2.17.5",
    "browserify": "^14.5.0",
    "del": "^2.2.2",
    "gulp": "^3.9.1",
    "gulp-autoprefixer": "^3.1.1",
    "gulp-babel": "^7.0.0",
    "gulp-changed": "^1.3.2",
    "gulp-clean-css": "^2.0.13",
    "gulp-concat": "^2.6.0",
    "gulp-html-replace": "^1.6.1",
    "gulp-htmlmin": "^3.0.0",
    "gulp-imagemin": "^3.0.3",
    "gulp-sass": "^2.3.2",
    "gulp-sass-glob": "^1.0.8",
    "gulp-sourcemaps": "^2.1.1",
    "gulp-uglify": "^2.0.0",
    "run-sequence": "^1.2.2",
    "uglifyify": "^4.0.4",
    "vinyl-source-stream": "^1.1.0",
    "watchify": "^3.9.0",
  },
  "dependencies": {
  }
}