Last active
October 4, 2024 11:49
-
-
Save tterb/9bd8e94eb094f1f38fc3dd33a250a2ed to your computer and use it in GitHub Desktop.
An updated gulpfile for tterb.github.io
This file contains 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
// Gulpfile.js | |
const autoprefixer = require('autoprefixer'); | |
const browserSync = require('browser-sync').create(); | |
const concat = require('gulp-concat'); | |
const cssnano = require('cssnano'); | |
const del = require('del'); | |
const gulp = require('gulp'); | |
const gutil = require('gulp-util'); | |
const imagemin = require('gulp-imagemin'); | |
const pngquant = require('imagemin-pngquant'); | |
const postcss = require('gulp-postcss'); | |
const rename = require('gulp-rename'); | |
const run = require('gulp-run'); | |
const runSequence = require('run-sequence'); | |
const sass = require('gulp-ruby-sass'); | |
const uglify = require('gulp-uglify-es').default; | |
// Include paths file | |
const paths = require('./_assets/gulp-config/paths'); | |
// Process styles, add vendor-prefixes, minify, then | |
// output the file to the appropriate location | |
gulp.task('build:styles:main', function() { | |
return sass(paths.sassFiles + '/main.scss', { | |
style: 'compressed', | |
trace: true, | |
loadPath: [paths.sassFiles] | |
}).pipe(postcss([autoprefixer({ browsers: ['last 2 versions']}), cssnano()])) | |
.pipe(gulp.dest(paths.jekyllCssFiles)) | |
.pipe(gulp.dest(paths.siteCssFiles)) | |
.pipe(browserSync.stream()) | |
.on('error', gutil.log); | |
}); | |
// Create and process critical CSS file to be included in head.html | |
gulp.task('build:styles:critical', function() { | |
return sass(paths.sassFiles + '/critical.scss', { | |
style: 'compressed', | |
trace: true, | |
loadPath: [paths.sassFiles] | |
}).pipe(postcss([ autoprefixer({ browsers: ['last 2 versions'] }) ])) | |
.pipe(gulp.dest('_includes')) | |
.on('error', gutil.log); | |
}); | |
// Build all styles | |
gulp.task('build:styles', ['build:styles:main', 'build:styles:critical']); | |
// Delete CSS | |
gulp.task('clean:styles', function(callback) { | |
del([paths.jekyllCssFiles + 'main.css', | |
paths.siteCssFiles + 'main.css', | |
'_includes/critical.css' | |
]); | |
callback(); | |
}); | |
// Concatenate and uglify global JS files and output the | |
// result to the appropriate location | |
gulp.task('build:scripts:global', function() { | |
return gulp.src([ | |
paths.jsFiles + '/lib' + paths.jsPattern, | |
paths.jsFiles + '/*.js' | |
]) | |
.pipe(concat('main.js')) | |
.pipe(uglify()) | |
.pipe(gulp.dest(paths.jekyllJsFiles)) | |
.pipe(gulp.dest(paths.siteJsFiles)) | |
.on('error', gutil.log); | |
}); | |
// Uglify local JS files and output the result to the | |
// appropriate location | |
gulp.task('build:scripts:local', function() { | |
return gulp.src(paths.jsFiles + '/local' + paths.jsPattern) | |
.pipe(uglify()) | |
.pipe(gulp.dest(paths.jekyllJsFiles)) | |
.pipe(gulp.dest(paths.siteJsFiles)) | |
.on('error', gutil.log); | |
}); | |
// Build all scripts | |
gulp.task('build:scripts', ['build:scripts:local', 'build:scripts:global', 'build:scripts:local']); | |
// Delete processed JS | |
gulp.task('clean:scripts', function(callback) { | |
del([paths.jekyllJsFiles + 'main.js', paths.siteJsFiles + 'main.js']); | |
callback(); | |
}); | |
// Copy fonts | |
gulp.task('build:fonts', ['fonts']); | |
// Place fonts in proper location | |
gulp.task('fonts', function() { | |
return gulp.src(paths.fontFilesGlob) | |
.pipe(rename(function(path) {path.dirname = '';})) | |
.pipe(gulp.dest(paths.jekyllFontFiles)) | |
.pipe(gulp.dest(paths.siteFontFiles)) | |
.pipe(browserSync.stream()) | |
.on('error', gutil.log); | |
}); | |
// Delete processed font files | |
gulp.task('clean:fonts', function(callback) { | |
del([paths.jekyllFontFiles, paths.siteFontFiles]); | |
callback(); | |
}); | |
// Optimize and copy image files | |
gulp.task('build:images', function() { | |
return gulp.src(paths.imageFilesGlob) | |
.pipe(imagemin({ | |
optimizationLevel: 3, | |
progressive: true, | |
interlaced: true, | |
use: [pngquant()] | |
})) | |
.pipe(gulp.dest(paths.jekyllImageFiles)) | |
.pipe(gulp.dest(paths.siteImageFiles)) | |
.pipe(browserSync.stream()); | |
}); | |
// Delete processed images | |
gulp.task('clean:images', function(callback) { | |
del([paths.jekyllImageFiles, paths.siteImageFiles]); | |
callback(); | |
}); | |
// Place download files in proper location | |
gulp.task('build:downloads', function() { | |
return gulp.src(paths.downloadFiles + '/**/*.zip') | |
.pipe(rename(function(path) {path.dirname = '';})) | |
.pipe(gulp.dest(paths.jekyllDownloadFiles)) | |
.pipe(gulp.dest(paths.siteDownloadFiles)) | |
.pipe(browserSync.stream()) | |
.on('error', gutil.log); | |
}); | |
// Delete processed download files | |
gulp.task('clean:downloads', function(callback) { | |
del([paths.jekyllDownloadFiles, paths.siteDownloadFiles]); | |
callback(); | |
}); | |
// Run jekyll build command | |
gulp.task('build:jekyll', function() { | |
return gulp.src('') | |
.pipe(run('bundle exec jekyll build --config _config.yml')) | |
.on('error', gutil.log); | |
}); | |
// Delete the entire _site directory | |
gulp.task('clean:jekyll', function(callback) { | |
del(['_site']); | |
callback(); | |
}); | |
// Runs jekyll build command using test config. | |
gulp.task('build:jekyll:test', function() { | |
var shellCommand = 'bundle exec jekyll build --config _config.yml, _config.test.yml'; | |
return gulp.src('') | |
.pipe(run(shellCommand)) | |
.on('error', gutil.log); | |
}); | |
// Run jekyll build command using local config | |
gulp.task('build:jekyll:local', function() { | |
return gulp.src('') | |
.pipe(run('bundle exec jekyll build')) | |
.on('error', gutil.log); | |
}); | |
// Special tasks for building and reloading BrowserSync | |
gulp.task('build:jekyll:watch', ['build:jekyll:local'], function(callback) { | |
browserSync.reload(); | |
callback(); | |
}); | |
gulp.task('build:scripts:watch', ['build:scripts'], function(callback) { | |
browserSync.reload(); | |
callback(); | |
}); | |
// Serve site and watch files | |
gulp.task('serve', ['build'], function() { | |
browserSync.init({ | |
server: paths.siteDir, | |
ghostMode: false, // Toggle to mirror clicks, reloads etc (performance) | |
logFileChanges: true, | |
logLevel: 'debug', | |
open: true // Toggle to auto-open page when starting | |
}); | |
gulp.watch(['_config.yml'], ['build:jekyll:watch']); | |
// Watch .scss files and pipe changes to browserSync | |
gulp.watch('_assets/styles/**/*.scss', ['build:styles']); | |
// Watch .js files | |
gulp.watch('_assets/js/**/*.js', ['build:scripts:watch']); | |
// Watch image files and pipe changes to browserSync | |
gulp.watch('_assets/img/**/*', ['build:images']); | |
// Watch posts | |
gulp.watch('_posts/**/*.+(md|markdown|MD)', ['build:jekyll:watch']); | |
// Watch drafts if --drafts flag was passed | |
if (module.exports.drafts) { | |
gulp.watch('_drafts/*.+(md|markdown|MD)', ['build:jekyll:watch']); | |
} | |
// Watch html and markdown files | |
gulp.watch(['**/*.+(html|md|markdown|MD)', '!_site/**/*.*'], ['build:jekyll:watch']); | |
// Watch RSS feed | |
gulp.watch('feed.xml', ['build:jekyll:watch']); | |
// Watch data files | |
gulp.watch('_data/**.*+(yml|yaml|csv|json)', ['build:jekyll:watch']); | |
}); | |
// Build site | |
gulp.task('build', function(callback) { | |
runSequence(['build:scripts', 'build:styles', 'build:images', 'build:fonts', 'build:downloads'], 'build:jekyll', callback); | |
}); | |
gulp.task('build:test', function (callback) { | |
runSequence('clean', ['build:scripts', 'build:images', 'build:styles', 'build:fonts', 'build:downloads'], | |
'build:jekyll:test', | |
callback); | |
}); | |
// Deletes _site directory and processed assets | |
gulp.task('clean', ['clean:jekyll', 'clean:styles', 'clean:scripts', 'clean:images', 'clean:fonts', 'clean:downloads'] | |
); | |
// Default Task: build site | |
gulp.task('default', ['build']); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
gulp --version
CLI version: 2.3.0
Local version: 4.0.2