Created
February 4, 2014 20:18
-
-
Save mattbanks/8811514 to your computer and use it in GitHub Desktop.
Setup for using gulp in developing and deploying WordPress themes
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// Load plugins | |
var gulp = require('gulp'), | |
plugins = require('gulp-load-plugins')({ camelize: true }), | |
lr = require('tiny-lr'), | |
server = lr(); | |
// Styles | |
gulp.task('styles', function() { | |
return gulp.src('assets/styles/source/*.scss') | |
.pipe(plugins.rubySass({ style: 'expanded', compass: true })) | |
.pipe(plugins.autoprefixer('last 2 versions', 'ie 9', 'ios 6', 'android 4')) | |
.pipe(gulp.dest('assets/styles/build')) | |
.pipe(plugins.minifyCss({ keepSpecialComments: 1 })) | |
.pipe(plugins.livereload(server)) | |
.pipe(gulp.dest('./')) | |
.pipe(plugins.notify({ message: 'Styles task complete' })); | |
}); | |
// Vendor Plugin Scripts | |
gulp.task('plugins', function() { | |
return gulp.src(['assets/js/source/plugins.js', 'assets/js/vendor/*.js']) | |
.pipe(plugins.concat('plugins.js')) | |
.pipe(gulp.dest('assets/js/build')) | |
.pipe(plugins.rename({ suffix: '.min' })) | |
.pipe(plugins.uglify()) | |
.pipe(plugins.livereload(server)) | |
.pipe(gulp.dest('assets/js')) | |
.pipe(plugins.notify({ message: 'Scripts task complete' })); | |
}); | |
// Site Scripts | |
gulp.task('scripts', function() { | |
return gulp.src(['assets/js/source/*.js', '!assets/js/source/plugins.js']) | |
.pipe(plugins.jshint('.jshintrc')) | |
.pipe(plugins.jshint.reporter('default')) | |
.pipe(plugins.concat('main.js')) | |
.pipe(gulp.dest('assets/js/build')) | |
.pipe(plugins.rename({ suffix: '.min' })) | |
.pipe(plugins.uglify()) | |
.pipe(plugins.livereload(server)) | |
.pipe(gulp.dest('assets/js')) | |
.pipe(plugins.notify({ message: 'Scripts task complete' })); | |
}); | |
// Images | |
gulp.task('images', function() { | |
return gulp.src('assets/images/**/*') | |
.pipe(plugins.cache(plugins.imagemin({ optimizationLevel: 7, progressive: true, interlaced: true }))) | |
.pipe(plugins.livereload(server)) | |
.pipe(gulp.dest('assets/images')) | |
.pipe(plugins.notify({ message: 'Images task complete' })); | |
}); | |
// Watch | |
gulp.task('watch', function() { | |
// Listen on port 35729 | |
server.listen(35729, function (err) { | |
if (err) { | |
return console.log(err) | |
}; | |
// Watch .scss files | |
gulp.watch('assets/styles/source/**/*.scss', ['styles']); | |
// Watch .js files | |
gulp.watch('assets/js/**/*.js', ['plugins', 'scripts']); | |
// Watch image files | |
gulp.watch('assets/images/**/*', ['images']); | |
}); | |
}); | |
// Default task | |
gulp.task('default', ['styles', 'plugins', 'scripts', 'images', 'watch']); |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
{ | |
"name": "wordpress-starter-theme", | |
"version": "1.0.0", | |
"dependencies": {}, | |
"devDependencies": { | |
"gulp": "~3.5.1", | |
"gulp-autoprefixer": "0.0.6", | |
"gulp-cache": "~0.1.1", | |
"gulp-concat": "~2.1.7", | |
"gulp-imagemin": "~0.1.4", | |
"gulp-jshint": "~1.3.4", | |
"gulp-livereload": "~0.3.2", | |
"gulp-load-plugins": "~0.2.0", | |
"gulp-minify-css": "~0.2.0", | |
"gulp-notify": "~0.4.0", | |
"gulp-rename": "~0.2.2", | |
"gulp-ruby-sass": "~0.3.0", | |
"gulp-uglify": "~0.2.0", | |
"tiny-lr": "0.0.5" | |
} | |
} |
I'm with @joavpmamede, do you have a deploy regime set up?
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Hi Matt, do you run gulp on your server after deploying your theme? or just send everything from the theme folder (including sass source files, etc...)?