rkb81
6/13/2015 - 3:39 PM

example WordPress theme gulpfile

example WordPress theme gulpfile

var gulp = require('gulp');
var debug = require('gulp-debug');
var gutil = require('gulp-util');
var concat = require('gulp-concat');
var rename = require('gulp-rename');
var uglify = require('gulp-uglify');
var sass = require('gulp-sass');
var sourcemaps = require('gulp-sourcemaps');
var prefix = require('gulp-autoprefixer');
var filter = require('gulp-filter');
var bowerSrc = require('gulp-bower-src');
var bs = require('browser-sync');
var reload = bs.reload;

var jsFilter = filter('**/*.js', '!**/*.min.js');

gulp.task('build-js', function() {
  return gulp.src([
    'bower_components/adaptive.background/src/jquery.adaptive-backgrounds.js',
    'js_src/navigation.js',
    'js_src/skip-link-focus-fix.js',
    'js_src/sharedaddy.js',
    'js_src/relatedposts.js',
    'js_src/script.js',
  ])
  .pipe(sourcemaps.init({
    loadMaps: false,
    debug: debug,
  }))
  .pipe(concat('script.js', {
    newLine: '\n',
  }))
  .pipe(gulp.dest('js'))
  .pipe(rename('script.min.js'))
  .pipe(uglify())
  .pipe(sourcemaps.write('.', {
    includeContent: true,
    sourceRoot: '/',
  }))
  .pipe(gulp.dest('js'));
});

gulp.task('build-css', function() {
  gulp.src(['scss/*.scss'])
  .pipe(sourcemaps.init()) // Process the original sources
  .pipe(sass({
    errLogToConsole: true,
    includePaths: [
      'bower_components/font-awesome/scss',
      'bower_components/foundation/scss',
      'bower_components/animate-sass',
    ],
    outputStyle: 'compressed',
  }))
  .pipe(prefix({
    browsers: ['last 2 versions'],
    cascade: true,
  })) // Autoprefixer FTW
  .pipe(sourcemaps.write('./')) // Add the map to the modified source.
  .pipe(gulp.dest('./'))
  .pipe(filter('**/*.css')) // Filter stream to only css files for BS
  .pipe(reload({ stream:true }));
});

gulp.task('browser-sync', function() {
  bs({
    proxy: 'bfco.dev',

    // browser: ['firefox'],
  });
});

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

gulp.task('default', ['browser-sync'], function() {
  gulp.watch('js_src/*.js', ['build-js', 'bs-reload']); // Watch for changes to JS
  gulp.watch('scss/**/*.scss', ['build-css']); // Watch for changes to CSS
  gulp.watch('**/*.php', ['bs-reload']); // Watch for changes to WP templates
});