Add Purgecss

This commit is contained in:
Taylor Bryant 2018-02-08 23:15:15 -06:00
parent cf6a472f09
commit 6fbad8ad7d
3 changed files with 401 additions and 40 deletions

View File

@ -1,61 +1,91 @@
const gulp = require('gulp');
const gutil = require('gulp-util');
const child = require('child_process');
const browserSync = require('browser-sync').create();
const gulp = require("gulp");
const gutil = require("gulp-util");
const child = require("child_process");
const browserSync = require("browser-sync").create();
const siteRoot = "_site";
const mainCSS = "src/style.css"; /* Main stylesheet (pre-build) */
const tailwindConfig = "tailwind.js"; /* Tailwind config */
const siteRoot = '_site';
const mainCSS = 'src/style.css'; /* Main stylesheet (pre-build) */
const tailwindConfig = 'tailwind.js'; /* Tailwind config */
const jekyll = process.platform === 'win32' ? 'jekyll.bat' : 'jekyll'; /* Fix Windows compatibility issue */
/**
* Fix Windows compatibility issue
*/
const jekyll = process.platform === "win32" ? "jekyll.bat" : "jekyll";
/**
* Build Jekyll Site
*/
gulp.task('jekyll-build', function () {
browserSync.notify('Running: $ jekyll build');
return child.spawn(jekyll, ['build'], {stdio: 'inherit'});
gulp.task("jekyll-build", ["css"], function() {
browserSync.notify("Building Jekyll site...");
return child.spawn(jekyll, ["build"], { stdio: "inherit" });
});
/**
* Compile styles
* Custom PurgeCSS Extractor
* https://github.com/FullHuman/purgecss
*/
gulp.task('css', function () {
const atimport = require('postcss-import');
const postcss = require('gulp-postcss');
const tailwindcss = require('tailwindcss');
const autoprefixer = require('gulp-autoprefixer');
const cleancss = require('gulp-clean-css');
class TailwindExtractor {
static extract(content) {
return content.match(/[A-z0-9-:\/]+/g);
}
}
return gulp.src(mainCSS)
.pipe(postcss([
atimport(),
tailwindcss(tailwindConfig)
]))
.pipe(autoprefixer({
browsers: ['last 2 versions'],
cascade: false
}))
/**
* Compile CSS
*/
gulp.task("css", function() {
const atimport = require("postcss-import");
const postcss = require("gulp-postcss");
const tailwindcss = require("tailwindcss");
const purgecss = require("gulp-purgecss");
const autoprefixer = require("gulp-autoprefixer");
const cleancss = require("gulp-clean-css");
browserSync.notify("Compiling CSS...");
return gulp
.src(mainCSS)
.pipe(postcss([atimport(), tailwindcss(tailwindConfig)]))
.pipe(
purgecss({
content: ["_site/**/*.html"],
extractors: [
{
extractor: TailwindExtractor,
extensions: ["html", "js"]
}
]
})
)
.pipe(
autoprefixer({
browsers: ["last 2 versions"],
cascade: false
})
)
.pipe(cleancss())
.pipe(gulp.dest('assets/css/'))
.pipe(gulp.dest('_site/assets/css/'))
.pipe(gulp.dest("assets/css/"))
.pipe(gulp.dest("_site/assets/css/"));
});
/**
* Serve site with Browsersync
*/
gulp.task('serve', ['jekyll-build'], () => {
gulp.task("serve", ["jekyll-build"], () => {
browserSync.init({
files: [siteRoot + '/**'],
port: 4000,
files: [siteRoot + "/**"],
open: "local",
port: 4000,
server: {
baseDir: siteRoot
}
});
gulp.watch([mainCSS, tailwindConfig], ['css']);
gulp.watch(['**/*.html', '**/*.md', '**/*.yml', '!_site/**/*'], { interval: 500 }, ['jekyll-build']);
gulp.watch([mainCSS, tailwindConfig], ["css"]);
gulp.watch(
["**/*.html", "**/*.md", "**/*.yml", "!_site/**/*, !node_modules"],
{ interval: 500 },
["jekyll-build"]
);
});
gulp.task('default', ['css', 'serve']);
gulp.task("default", ["serve"]);

338
package-lock.json generated
View File

@ -82,6 +82,15 @@
}
}
},
"ansi-colors": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/ansi-colors/-/ansi-colors-1.0.1.tgz",
"integrity": "sha512-yopkAU0ZD/WQ56Tms3xLn6jRuX3SyUMAVi0FdmDIbmmnHW3jHiI1sQFdUl3gfVddjnrsP3Y6ywFKvCRopvoVIA==",
"dev": true,
"requires": {
"ansi-wrap": "0.1.0"
}
},
"ansi-cyan": {
"version": "0.1.1",
"resolved": "https://registry.npmjs.org/ansi-cyan/-/ansi-cyan-0.1.1.tgz",
@ -1950,7 +1959,6 @@
"dashdash": "1.14.1",
"ecc-jsbn": "0.1.1",
"getpass": "0.1.7",
"jodid25519": "1.0.2",
"jsbn": "0.1.1",
"tweetnacl": "0.14.5"
},
@ -2388,6 +2396,71 @@
"vinyl-sourcemaps-apply": "0.2.1"
}
},
"gulp-purgecss": {
"version": "0.20.0",
"resolved": "https://registry.npmjs.org/gulp-purgecss/-/gulp-purgecss-0.20.0.tgz",
"integrity": "sha512-jM0Sy5pakO1zXcv/EqRQZQMoFUUVQkXAvi9aJCqL1Uk/0cy19oOlDZTg3HhgY+frUc/FX8PyhG1jZAR+uGGJlQ==",
"dev": true,
"requires": {
"glob": "7.1.2",
"plugin-error": "1.0.1",
"purgecss": "0.20.0",
"through2": "2.0.3"
},
"dependencies": {
"arr-diff": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/arr-diff/-/arr-diff-4.0.0.tgz",
"integrity": "sha1-1kYQdP6/7HHn4VI1dhoyml3HxSA=",
"dev": true
},
"extend-shallow": {
"version": "3.0.2",
"resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-3.0.2.tgz",
"integrity": "sha1-Jqcarwc7OfshJxcnRhMcJwQCjbg=",
"dev": true,
"requires": {
"assign-symbols": "1.0.0",
"is-extendable": "1.0.1"
}
},
"glob": {
"version": "7.1.2",
"resolved": "https://registry.npmjs.org/glob/-/glob-7.1.2.tgz",
"integrity": "sha512-MJTUg1kjuLeQCJ+ccE4Vpa6kKVXkPYJ2mOCQyUuKLcLQsdrMCpBPUi8qVE6+YuaJkozeA9NusTAw3hLr8Xe5EQ==",
"dev": true,
"requires": {
"fs.realpath": "1.0.0",
"inflight": "1.0.6",
"inherits": "2.0.3",
"minimatch": "3.0.4",
"once": "1.3.3",
"path-is-absolute": "1.0.1"
}
},
"is-extendable": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/is-extendable/-/is-extendable-1.0.1.tgz",
"integrity": "sha512-arnXMxT1hhoKo9k1LZdmlNyJdDDfy2v0fXjFlmok4+i8ul/6WlbVge9bhM74OpNPQPMGUToDtz+KXa1PneJxOA==",
"dev": true,
"requires": {
"is-plain-object": "2.0.4"
}
},
"plugin-error": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/plugin-error/-/plugin-error-1.0.1.tgz",
"integrity": "sha512-L1zP0dk7vGweZME2i+EeakvUNqSrdiI3F91TwEoYiGrAfUXmVv6fJIq4g82PAXxNsWOp0J7ZqQy/3Szz0ajTxA==",
"dev": true,
"requires": {
"ansi-colors": "1.0.1",
"arr-diff": "4.0.0",
"arr-union": "3.1.0",
"extend-shallow": "3.0.2"
}
}
}
},
"gulp-util": {
"version": "3.0.8",
"resolved": "https://registry.npmjs.org/gulp-util/-/gulp-util-3.0.8.tgz",
@ -2642,6 +2715,12 @@
"integrity": "sha1-khi5srkoojixPcT7a21XbyMUU+o=",
"dev": true
},
"indexes-of": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/indexes-of/-/indexes-of-1.0.1.tgz",
"integrity": "sha1-8w9xbI4r00bHtn0985FVZqfAVgc=",
"dev": true
},
"indexof": {
"version": "0.0.1",
"resolved": "https://registry.npmjs.org/indexof/-/indexof-0.0.1.tgz",
@ -3195,6 +3274,24 @@
}
}
},
"locate-path": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/locate-path/-/locate-path-2.0.0.tgz",
"integrity": "sha1-K1aLJl7slExtnA3pw9u7ygNUzY4=",
"dev": true,
"requires": {
"p-locate": "2.0.0",
"path-exists": "3.0.0"
},
"dependencies": {
"path-exists": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/path-exists/-/path-exists-3.0.0.tgz",
"integrity": "sha1-zg6+ql94yxiSXqfYENe1mwEP1RU=",
"dev": true
}
}
},
"lodash": {
"version": "3.10.1",
"resolved": "https://registry.npmjs.org/lodash/-/lodash-3.10.1.tgz",
@ -3385,6 +3482,15 @@
"object-visit": "1.0.1"
}
},
"mem": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/mem/-/mem-1.1.0.tgz",
"integrity": "sha1-Xt1StIXKHZAP5kiVUFOZoN+kX3Y=",
"dev": true,
"requires": {
"mimic-fn": "1.2.0"
}
},
"micromatch": {
"version": "2.3.11",
"resolved": "https://registry.npmjs.org/micromatch/-/micromatch-2.3.11.tgz",
@ -3427,6 +3533,12 @@
"mime-db": "1.30.0"
}
},
"mimic-fn": {
"version": "1.2.0",
"resolved": "https://registry.npmjs.org/mimic-fn/-/mimic-fn-1.2.0.tgz",
"integrity": "sha512-jf84uxzwiuiIVKiOLpfYk7N46TSy8ubTonmneY9vrpHNAnp0QBt2BxWV9dO3/j+BoVAb+a5G6YDPW3M5HOdMWQ==",
"dev": true
},
"minimatch": {
"version": "3.0.4",
"resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.0.4.tgz",
@ -3562,6 +3674,7 @@
"detect-libc": "1.0.2",
"hawk": "3.1.3",
"mkdirp": "0.5.1",
"nopt": "4.0.1",
"npmlog": "4.1.0",
"rc": "1.2.4",
"request": "2.81.0",
@ -3569,6 +3682,19 @@
"semver": "5.5.0",
"tar": "2.2.1",
"tar-pack": "3.4.0"
},
"dependencies": {
"nopt": {
"version": "4.0.1",
"resolved": "https://registry.npmjs.org/nopt/-/nopt-4.0.1.tgz",
"integrity": "sha1-0NRoWv1UFRk8jHUFYC0NF81kR00=",
"dev": true,
"optional": true,
"requires": {
"abbrev": "1.1.1",
"osenv": "0.1.4"
}
}
}
},
"nodemon": {
@ -4170,8 +4296,7 @@
"os-homedir": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/os-homedir/-/os-homedir-1.0.2.tgz",
"integrity": "sha1-/7xJiDNuDoM94MFox+8VISGqf7M=",
"dev": true
"integrity": "sha1-/7xJiDNuDoM94MFox+8VISGqf7M="
},
"os-locale": {
"version": "1.4.0",
@ -4182,12 +4307,50 @@
"lcid": "1.0.0"
}
},
"os-tmpdir": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/os-tmpdir/-/os-tmpdir-1.0.2.tgz",
"integrity": "sha1-u+Z0BseaqFxc/sdm/lc0VV36EnQ="
},
"osenv": {
"version": "0.1.4",
"resolved": "https://registry.npmjs.org/osenv/-/osenv-0.1.4.tgz",
"integrity": "sha1-Qv5tWVPfBsgGS+bxdsPQWqqjRkQ=",
"requires": {
"os-homedir": "1.0.2",
"os-tmpdir": "1.0.2"
}
},
"p-finally": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/p-finally/-/p-finally-1.0.0.tgz",
"integrity": "sha1-P7z7FbiZpEEjs0ttzBi3JDNqLK4=",
"dev": true
},
"p-limit": {
"version": "1.2.0",
"resolved": "https://registry.npmjs.org/p-limit/-/p-limit-1.2.0.tgz",
"integrity": "sha512-Y/OtIaXtUPr4/YpMv1pCL5L5ed0rumAaAeBSj12F+bSlMdys7i8oQF/GUJmfpTS/QoaRrS/k6pma29haJpsMng==",
"dev": true,
"requires": {
"p-try": "1.0.0"
}
},
"p-locate": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/p-locate/-/p-locate-2.0.0.tgz",
"integrity": "sha1-IKAQOyIqcMj9OcwuWAaA893l7EM=",
"dev": true,
"requires": {
"p-limit": "1.2.0"
}
},
"p-try": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/p-try/-/p-try-1.0.0.tgz",
"integrity": "sha1-y8ec26+P1CKOE/Yh8rGiN8GyB7M=",
"dev": true
},
"package-json": {
"version": "4.0.1",
"resolved": "https://registry.npmjs.org/package-json/-/package-json-4.0.1.tgz",
@ -4652,6 +4815,17 @@
}
}
},
"postcss-selector-parser": {
"version": "3.1.1",
"resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-3.1.1.tgz",
"integrity": "sha1-T4dfSvsMllc9XPTXQBGu4lCn6GU=",
"dev": true,
"requires": {
"dot-prop": "4.2.0",
"indexes-of": "1.0.1",
"uniq": "1.0.1"
}
},
"postcss-value-parser": {
"version": "3.3.0",
"resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-3.3.0.tgz",
@ -4711,6 +4885,137 @@
"resolved": "https://registry.npmjs.org/punycode/-/punycode-1.4.1.tgz",
"integrity": "sha1-wNWmOycYgArY4esPpSachN1BhF4="
},
"purgecss": {
"version": "0.20.0",
"resolved": "https://registry.npmjs.org/purgecss/-/purgecss-0.20.0.tgz",
"integrity": "sha512-YBO44jr8gGgMQe6EWXoFI+70pYdVnK+QPxMLVFWE7lSeq6ttVes8RbFD6Qmx6dYUMCKAjvXW9QhjpeSEMGZavg==",
"dev": true,
"requires": {
"glob": "7.1.2",
"postcss": "6.0.16",
"postcss-selector-parser": "3.1.1",
"yargs": "11.0.0"
},
"dependencies": {
"ansi-regex": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.0.0.tgz",
"integrity": "sha1-7QMXwyIGT3lGbAKWa922Bas32Zg=",
"dev": true
},
"camelcase": {
"version": "4.1.0",
"resolved": "https://registry.npmjs.org/camelcase/-/camelcase-4.1.0.tgz",
"integrity": "sha1-1UVjW+HjPFQmScaRc+Xeas+uNN0=",
"dev": true
},
"cliui": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/cliui/-/cliui-4.0.0.tgz",
"integrity": "sha512-nY3W5Gu2racvdDk//ELReY+dHjb9PlIcVDFXP72nVIhq2Gy3LuVXYwJoPVudwQnv1shtohpgkdCKT2YaKY0CKw==",
"dev": true,
"requires": {
"string-width": "2.1.1",
"strip-ansi": "4.0.0",
"wrap-ansi": "2.1.0"
}
},
"find-up": {
"version": "2.1.0",
"resolved": "https://registry.npmjs.org/find-up/-/find-up-2.1.0.tgz",
"integrity": "sha1-RdG35QbHF93UgndaK3eSCjwMV6c=",
"dev": true,
"requires": {
"locate-path": "2.0.0"
}
},
"glob": {
"version": "7.1.2",
"resolved": "https://registry.npmjs.org/glob/-/glob-7.1.2.tgz",
"integrity": "sha512-MJTUg1kjuLeQCJ+ccE4Vpa6kKVXkPYJ2mOCQyUuKLcLQsdrMCpBPUi8qVE6+YuaJkozeA9NusTAw3hLr8Xe5EQ==",
"dev": true,
"requires": {
"fs.realpath": "1.0.0",
"inflight": "1.0.6",
"inherits": "2.0.3",
"minimatch": "3.0.4",
"once": "1.3.3",
"path-is-absolute": "1.0.1"
}
},
"is-fullwidth-code-point": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-2.0.0.tgz",
"integrity": "sha1-o7MKXE8ZkYMWeqq5O+764937ZU8=",
"dev": true
},
"os-locale": {
"version": "2.1.0",
"resolved": "https://registry.npmjs.org/os-locale/-/os-locale-2.1.0.tgz",
"integrity": "sha512-3sslG3zJbEYcaC4YVAvDorjGxc7tv6KVATnLPZONiljsUncvihe9BQoVCEs0RZ1kmf4Hk9OBqlZfJZWI4GanKA==",
"dev": true,
"requires": {
"execa": "0.7.0",
"lcid": "1.0.0",
"mem": "1.1.0"
}
},
"string-width": {
"version": "2.1.1",
"resolved": "https://registry.npmjs.org/string-width/-/string-width-2.1.1.tgz",
"integrity": "sha512-nOqH59deCq9SRHlxq1Aw85Jnt4w6KvLKqWVik6oA9ZklXLNIOlqg4F2yrT1MVaTjAqvVwdfeZ7w7aCvJD7ugkw==",
"dev": true,
"requires": {
"is-fullwidth-code-point": "2.0.0",
"strip-ansi": "4.0.0"
}
},
"strip-ansi": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-4.0.0.tgz",
"integrity": "sha1-qEeQIusaw2iocTibY1JixQXuNo8=",
"dev": true,
"requires": {
"ansi-regex": "3.0.0"
}
},
"which-module": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/which-module/-/which-module-2.0.0.tgz",
"integrity": "sha1-2e8H3Od7mQK4o6j6SzHD4/fm6Ho=",
"dev": true
},
"yargs": {
"version": "11.0.0",
"resolved": "https://registry.npmjs.org/yargs/-/yargs-11.0.0.tgz",
"integrity": "sha512-Rjp+lMYQOWtgqojx1dEWorjCofi1YN7AoFvYV7b1gx/7dAAeuI4kN5SZiEvr0ZmsZTOpDRcCqrpI10L31tFkBw==",
"dev": true,
"requires": {
"cliui": "4.0.0",
"decamelize": "1.2.0",
"find-up": "2.1.0",
"get-caller-file": "1.0.2",
"os-locale": "2.1.0",
"require-directory": "2.1.1",
"require-main-filename": "1.0.1",
"set-blocking": "2.0.0",
"string-width": "2.1.1",
"which-module": "2.0.0",
"y18n": "3.2.1",
"yargs-parser": "9.0.2"
}
},
"yargs-parser": {
"version": "9.0.2",
"resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-9.0.2.tgz",
"integrity": "sha1-nM9qQ0YP5O1Aqbto9I1DuKaMwHc=",
"dev": true,
"requires": {
"camelcase": "4.1.0"
}
}
}
},
"qs": {
"version": "6.2.1",
"resolved": "https://registry.npmjs.org/qs/-/qs-6.2.1.tgz",
@ -5021,7 +5326,26 @@
"version": "2.6.1",
"resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.6.1.tgz",
"integrity": "sha1-wjOOxkPfeht/5cVPqG9XQopV8z0=",
"dev": true
"dev": true,
"requires": {
"glob": "7.1.2"
},
"dependencies": {
"glob": {
"version": "7.1.2",
"resolved": "https://registry.npmjs.org/glob/-/glob-7.1.2.tgz",
"integrity": "sha512-MJTUg1kjuLeQCJ+ccE4Vpa6kKVXkPYJ2mOCQyUuKLcLQsdrMCpBPUi8qVE6+YuaJkozeA9NusTAw3hLr8Xe5EQ==",
"dev": true,
"requires": {
"fs.realpath": "1.0.0",
"inflight": "1.0.6",
"inherits": "2.0.3",
"minimatch": "3.0.4",
"once": "1.3.3",
"path-is-absolute": "1.0.1"
}
}
}
},
"rx": {
"version": "4.1.0",
@ -6054,6 +6378,12 @@
}
}
},
"uniq": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/uniq/-/uniq-1.0.1.tgz",
"integrity": "sha1-sxxa6CVIRKOoKBVBzisEuGWnNP8=",
"dev": true
},
"unique-stream": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/unique-stream/-/unique-stream-1.0.0.tgz",

View File

@ -9,6 +9,7 @@
"gulp-autoprefixer": "^4.0.0",
"gulp-clean-css": "^3.9.0",
"gulp-postcss": "^7.0.0",
"gulp-purgecss": "^0.20.0",
"gulp-util": "^3.0.8",
"postcss-import": "^11.0.0",
"tailwindcss": "^0.4.1"