Skip to content

Instantly share code, notes, and snippets.

@vladfil
Created July 24, 2017 19:08
Show Gist options
  • Select an option

  • Save vladfil/10742d41cd0708ef2d2e501b899a1b94 to your computer and use it in GitHub Desktop.

Select an option

Save vladfil/10742d41cd0708ef2d2e501b899a1b94 to your computer and use it in GitHub Desktop.
Gulp for develop WordPress themes
var themename = 'NAME';
var gulp = require('gulp'),
// Prepare and optimize code etc
autoprefixer = require('autoprefixer'),
browserSync = require('browser-sync').create(),
image = require('gulp-image'),
jshint = require('gulp-jshint'),
postcss = require('gulp-postcss'),
sass = require('gulp-sass'),
sourcemaps = require('gulp-sourcemaps'),
// Only work with new or updated files
newer = require('gulp-newer'),
// Name of working theme folder
root = '../' + themename + '/',
scss = root + 'sass/',
js = root + 'js/',
img = root + 'images/',
languages = root + 'languages/';
// CSS via Sass and Autoprefixer
gulp.task('css', function() {
return gulp.src(scss + '{style.scss,rtl.scss}')
.pipe(sourcemaps.init())
.pipe(sass({
outputStyle: 'expanded',
indentType: 'tab',
indentWidth: '1'
}).on('error', sass.logError))
.pipe(postcss([
autoprefixer('last 2 versions', '> 1%')
]))
.pipe(sourcemaps.write(scss + 'maps'))
.pipe(gulp.dest(root));
});
// Optimize images through gulp-image
gulp.task('images', function() {
return gulp.src(img + 'RAW/**/*.{jpg,JPG,png}')
.pipe(newer(img))
.pipe(image())
.pipe(gulp.dest(img));
});
// JavaScript
gulp.task('javascript', function() {
return gulp.src([js + '*.js'])
.pipe(jshint())
.pipe(jshint.reporter('default'))
.pipe(gulp.dest(js));
});
// Watch everything
gulp.task('watch', function() {
browserSync.init({
open: 'external',
proxy: 'URL',
port: 8080
});
gulp.watch([root + '**/*.css', root + '**/*.scss' ], ['css']);
gulp.watch(js + '**/*.js', ['javascript']);
gulp.watch(img + 'RAW/**/*.{jpg,JPG,png}', ['images']);
gulp.watch(root + '**/*').on('change', browserSync.reload);
});
// Default task (runs at initiation: gulp --verbose)
gulp.task('default', ['watch']);
{
"name": "humescores",
"version": "0.0.1",
"description": "Accessible WordPress theme utilizing flex layouts and modern development practices.",
"main": "index.php",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"repository": {
"type": "git",
"url": "git+https://github.com/mor10/humescores"
},
"author": "Morten Rand-Hendriksen",
"license": "GPL-3.0",
"bugs": {
"url": "https://github.com/mor10/humescores/issues"
},
"homepage": "https://github.com/mor10/humescores#readme",
"devDependencies": {
"autoprefixer": "^6.5.2",
"browser-sync": "^2.17.6",
"gulp": "^3.9.1",
"gulp-image": "^2.7.2",
"gulp-jshint": "^2.0.2",
"gulp-newer": "^1.3.0",
"gulp-postcss": "^6.2.0",
"gulp-sass": "^2.3.2",
"gulp-sourcemaps": "^2.2.0",
"jshint": "^2.9.4"
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment