Gulp Wordpress Base
{
"name": "gulp-press",
"version": "1.0.0",
"description": "Build Tools for WordPress via Gulp",
"main": "index.php",
"dependencies": {},
"devDependencies": {
"babel-core": "^6.20.0",
"babel-preset-es2015": "^6.18.0",
"browser-sync": "^2.18.5",
"del": "^2.2.2",
"gulp": "^3.9.1",
"gulp-autoprefixer": "^3.1.1",
"gulp-babel": "^6.1.2",
"gulp-concat": "^2.6.1",
"gulp-cssnano": "^2.1.2",
"gulp-plumber": "^1.1.0",
"gulp-rename": "^1.2.2",
"gulp-sass": "^2.3.2",
"gulp-sourcemaps": "^1.9.1",
"gulp-uglify": "^2.0.0",
"gulp-util": "^3.0.7",
"node-sass": "^3.13.1"
},
"scripts": {
"start": ""
},
"author": "Mizner",
"license": "ISC",
"homepage": "https://gist.github.com/Mizner/4a1fb77e0660f1123241d5669af873ac"
}
const project = "XXXXXX";
const theFiles = [
// 1st file loads first, 2nd, ect.
];
const fileArray = theFiles.map(function (file) {
return "assets/scripts/" + file;
});
const gulp = require("gulp"),
bs = require("browser-sync").create(),
autoprefixer = require("gulp-autoprefixer"),
cssnano = require("gulp-cssnano"),
uglify = require("gulp-uglify"),
rename = require("gulp-rename"),
concat = require("gulp-concat"),
sass = require("gulp-sass"),
sourcemaps = require("gulp-sourcemaps"),
babel = require("gulp-babel"),
plumber = require("gulp-plumber"),
del = require('del');
gulp.task("sass", () => {
gulp.src("./assets/styles/**/*.scss")
.pipe(sourcemaps.init())
.pipe(sass().on("error", sass.logError))
.pipe(autoprefixer())
.pipe(sourcemaps.write())
.pipe(rename(project + ".min.css"))
.pipe(gulp.dest("./dist"))
.pipe(bs.stream())
});
gulp.task("js", () => {
gulp.src(fileArray)
.pipe(plumber())
.pipe(sourcemaps.init())
.pipe(concat("output.min.js")) // concat pulls all our files together before minifying them
.pipe(sourcemaps.write())
.pipe(babel({
presets: ["es2015"]
}))
.pipe(uglify())
.pipe(rename(project + ".min.js"))
.pipe(gulp.dest("./dist"))
.pipe(bs.stream())
});
gulp.task("production-sass", () => {
gulp.src("assets/styles/**/*.scss")
.pipe(sass().on("error", sass.logError))
.pipe(autoprefixer())
.pipe(cssnano())
.pipe(rename(project + ".min.css"))
.pipe(gulp.dest("./dist"));
});
gulp.task("browser-sync", () => {
bs.init(["*"], {
proxy: project + ".dev",
root: [__dirname],
open: {
file: "index.php"
}
});
});
gulp.task("clean:dist", () => {
return del([
"dist/**/*" // here we use a globbing pattern to match everything inside the `dist` folder
]);
});
gulp.task("watch", ["browser-sync"], () => {
gulp.watch("assets/styles/**/*.scss", ["sass"]);
gulp.watch("./assets/scripts/**/*.js", ["js"]);
gulp.watch("**/*.php", bs.reload);
gulp.watch("gulpfile.js").on("change", function () {
process.exit(0)
})
});
gulp.task("default", [
"clean:dist",
"production-sass",
"js"
]);