mirror of
https://github.com/kremalicious/blog.git
synced 2024-11-14 09:05:17 +01:00
402 lines
10 KiB
JavaScript
402 lines
10 KiB
JavaScript
// load plugins
|
|
var $ = require('gulp-load-plugins')();
|
|
|
|
// manually require modules that won"t get picked up by gulp-load-plugins
|
|
var gulp = require('gulp'),
|
|
del = require('del'),
|
|
chalk = require('chalk'),
|
|
merge = require('merge-stream'),
|
|
pkg = require('./package.json');
|
|
|
|
// Temporary solution until gulp 4
|
|
// https://github.com/gulpjs/gulp/issues/355
|
|
var runSequence = require('run-sequence');
|
|
|
|
// handle errors
|
|
var onError = function(error) {
|
|
console.log(chalk.red('You fucked up:', error.message, 'on line' , error.lineNumber));
|
|
}
|
|
|
|
|
|
// ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
|
|
// Terminal Banner
|
|
// ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
|
|
|
|
console.log("");
|
|
console.log(" <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<>>>>>>>>>>>>>>>>>>>>>>>>>>>>");
|
|
console.log("");
|
|
console.log(" (o) Just what do you think you're doing, Matthias? ");
|
|
console.log("");
|
|
console.log(" <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<>>>>>>>>>>>>>>>>>>>>>>>>>>>>");
|
|
console.log("");
|
|
|
|
// ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
|
|
// Config
|
|
// ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
|
|
|
|
// paths
|
|
var src = '_src',
|
|
dist = '_site',
|
|
cdn = 'https://d2jlreog722xe2.cloudfront.net';
|
|
|
|
// icons
|
|
var icons = {
|
|
entypo: {
|
|
src: src + '/_assets/icons/entypo/',
|
|
dist: dist + '/assets/img/',
|
|
prefix: 'entypo-',
|
|
icons: [
|
|
'twitter', 'facebook', 'google+', 'magnifying-glass', 'menu', 'rss', 'link', 'arrow-with-circle-down', 'forward', 'heart', 'info-with-circle', 'infinity', 'github', 'chevron-right', 'chevron-left', 'eye'
|
|
]
|
|
}
|
|
}
|
|
|
|
// SVG sprite
|
|
spriteConfig = {
|
|
dest: dist + '/assets/img/',
|
|
mode: {
|
|
symbol: {
|
|
dest: './',
|
|
sprite: 'sprite.svg'
|
|
}
|
|
}
|
|
}
|
|
|
|
// code banner
|
|
var banner = [
|
|
'/**',
|
|
' ** <%= pkg.name %> v<%= pkg.version %>',
|
|
' ** <%= pkg.description %>',
|
|
' ** <%= pkg.homepage %>',
|
|
' **',
|
|
' ** <%= pkg.author.name %> <<%= pkg.author.email %>>',
|
|
' **',
|
|
' ** YOU EARNED THE GEEK ACHIEVEMENT ',
|
|
' ** FOR LOOKING AT MY SOURCE ',
|
|
' **',
|
|
' ** But because of all the minimizing and caching ',
|
|
' ** going on you better check out the code on ',
|
|
' ** github ',
|
|
' ** ',
|
|
' ** <%= pkg.repository.url %> ',
|
|
' **/',
|
|
''
|
|
].join('\n');
|
|
|
|
// ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
|
|
// Tasks
|
|
// ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
|
|
|
|
//
|
|
// Delete build artifacts
|
|
//
|
|
gulp.task('clean', function(cb) {
|
|
return del([
|
|
dist + '/**/*',
|
|
dist + '/.*', // delete all hidden files
|
|
'!' + dist + '/media/**'
|
|
], cb);
|
|
});
|
|
|
|
|
|
//
|
|
// Jekyll
|
|
//
|
|
gulp.task('jekyll', function(cb) {
|
|
var spawn = require('child_process').spawn;
|
|
var jekyll = spawn('jekyll', ['build', '--drafts', '--future'], {
|
|
stdio: 'inherit'
|
|
});
|
|
|
|
jekyll.on('exit', function(code) {
|
|
cb(code === 0 ? null : 'ERROR: Jekyll process exited with code: ' + code);
|
|
});
|
|
});
|
|
|
|
gulp.task('jekyll:production', function(cb) {
|
|
var spawn = require('child_process').spawn;
|
|
var jekyll = spawn('jekyll', ['build', '--lsi'], {
|
|
stdio: 'inherit'
|
|
});
|
|
|
|
jekyll.on('exit', function(code) {
|
|
cb(code === 0 ? null : 'ERROR: Jekyll process exited with code: ' + code);
|
|
});
|
|
});
|
|
|
|
|
|
//
|
|
// Styles
|
|
//
|
|
gulp.task('css', function() {
|
|
return gulp.src([
|
|
src + '/_assets/styl/kremalicious3.styl',
|
|
src + '/_assets/styl/poststyle-2300.styl'
|
|
])
|
|
.pipe($.stylus({
|
|
'include css': true
|
|
})).on('error', onError)
|
|
.pipe(gulp.dest(dist + '/assets/css/'))
|
|
.pipe($.autoprefixer({
|
|
browsers: 'last 2 versions'
|
|
})).on('error', onError)
|
|
.pipe($.combineMq({ beautify: false }))
|
|
// .pipe($.uncss({
|
|
// html: [dist + '/**/*.html'],
|
|
// ignore: ['.in', '.collapsing']
|
|
// }))
|
|
.pipe($.cssmin())
|
|
.pipe($.rename({ suffix: '.min' }))
|
|
.pipe($.header(banner, { pkg: pkg }))
|
|
.pipe(gulp.dest(dist + '/assets/css/'))
|
|
.pipe($.connect.reload());
|
|
});
|
|
|
|
|
|
//
|
|
// Scripts
|
|
//
|
|
|
|
// Libraries
|
|
gulp.task('js-libraries', function() {
|
|
var picturefill = gulp.src('node_modules/picturefill/dist/picturefill.js');
|
|
|
|
return merge(picturefill)
|
|
.pipe($.uglify()).on('error', onError)
|
|
.pipe($.rename({
|
|
suffix: '.min'
|
|
}))
|
|
.pipe(gulp.dest(dist + '/assets/js/'))
|
|
});
|
|
|
|
// Project js
|
|
gulp.task('js-project', function() {
|
|
return gulp.src([
|
|
'node_modules/webcomponents.js/CustomElements.js',
|
|
'node_modules/svg4everybody/svg4everybody.js',
|
|
'node_modules/jquery/dist/jquery.js',
|
|
'node_modules/masonry-layout/dist/masonry.pkgd.js',
|
|
'node_modules/imagesloaded/imagesloaded.js',
|
|
'bower_components/simple-jekyll-search/dest/jekyll-search.js',
|
|
'bower_components/time-elements/time-elements.js',
|
|
src + '/_assets/js/*.js'
|
|
])
|
|
.pipe($.uglify()).on('error', onError)
|
|
.pipe($.concat('kremalicious3.min.js'))
|
|
.pipe($.header(banner, {
|
|
pkg: pkg
|
|
}))
|
|
.pipe(gulp.dest(dist + '/assets/js/'))
|
|
.pipe($.connect.reload());
|
|
});
|
|
|
|
// Collect all script tasks
|
|
gulp.task('js', ['js-libraries', 'js-project']);
|
|
|
|
|
|
//
|
|
// Icons
|
|
//
|
|
gulp.task('icons', function() {
|
|
var iconset = icons.entypo;
|
|
|
|
// Iterate through the icon set array
|
|
icons.entypo.icons.forEach(function(icon, i, icons) {
|
|
icons[i] = iconset.src + icon + '.svg';
|
|
});
|
|
|
|
return gulp.src(iconset.icons)
|
|
.pipe($.rename({ prefix: iconset.prefix }))
|
|
.pipe(gulp.dest(iconset.dist))
|
|
.pipe($.filter('**/*.svg'))
|
|
.pipe($.imagemin({ svgoPlugins: [{ removeViewBox: false }] }))
|
|
.pipe($.svgSprite(spriteConfig))
|
|
.pipe(gulp.dest(iconset.dist))
|
|
});
|
|
|
|
|
|
//
|
|
// Generate SVG fallbacks
|
|
//
|
|
gulp.task('svg-fallbacks', function() {
|
|
return gulp.src(dist + '/assets/img/*.svg')
|
|
.pipe($.svg2png())
|
|
.pipe(gulp.dest(dist + '/assets/img/png/'))
|
|
});
|
|
|
|
|
|
//
|
|
// Copy images
|
|
//
|
|
gulp.task('images', function() {
|
|
return gulp.src([src + '/_assets/img/**/*', '!' + src + '/_assets/img/entypo/**/*'])
|
|
.pipe(gulp.dest(dist + '/assets/img/'))
|
|
});
|
|
|
|
|
|
//
|
|
// Copy fonts
|
|
//
|
|
gulp.task('fonts', function() {
|
|
return gulp.src(src + '/_assets/fonts/**/*')
|
|
.pipe(gulp.dest(dist + '/assets/fonts/'))
|
|
});
|
|
|
|
|
|
//
|
|
// Copy media
|
|
//
|
|
gulp.task('media', function() {
|
|
return gulp.src(src + '/_media/**/*')
|
|
.pipe(gulp.dest(dist + '/media/'))
|
|
});
|
|
|
|
|
|
//
|
|
// Optimize HTML
|
|
//
|
|
gulp.task('optimize:html', function() {
|
|
return gulp.src(dist + '/**/*.html')
|
|
.pipe($.htmlmin({
|
|
collapseWhitespace: true,
|
|
conservativeCollapse: true,
|
|
removeComments: true,
|
|
useShortDoctype: true,
|
|
collapseBooleanAttributes: true,
|
|
removeRedundantAttributes: true,
|
|
removeEmptyAttributes: true,
|
|
removeEmptyAttributes: true
|
|
}))
|
|
.pipe(gulp.dest(dist));
|
|
});
|
|
|
|
|
|
//
|
|
// Optimize images
|
|
//
|
|
gulp.task('optimize:images', function() {
|
|
return gulp.src([
|
|
dist + '/**/*.{png,jpg,jpeg,gif,svg,webp}',
|
|
'!' + dist + '/media/**/*',
|
|
'!' + dist + '/assets/img/sprite*'
|
|
])
|
|
.pipe($.cache($.imagemin({
|
|
optimizationLevel: 5, // png
|
|
progressive: true, // jpg
|
|
interlaced: true, // gif
|
|
multipass: true, // svg
|
|
svgoPlugins: [{ removeViewBox: false }]
|
|
})))
|
|
.pipe(gulp.dest(dist));
|
|
});
|
|
|
|
|
|
//
|
|
// Revision static assets
|
|
//
|
|
gulp.task('revision', function() {
|
|
return gulp.src(dist + '/assets/**/*.{css,js,png,jpg,jpeg,svg,eot,ttf,woff}')
|
|
.pipe($.rev())
|
|
.pipe(gulp.dest(dist + '/assets/'))
|
|
// output rev manifest for next replace task
|
|
.pipe($.rev.manifest())
|
|
.pipe(gulp.dest(dist + '/assets/'));
|
|
});
|
|
|
|
|
|
//
|
|
// Replace all links to assets in files
|
|
// from a manifest file
|
|
//
|
|
gulp.task('revision-replace', function() {
|
|
|
|
var manifest = gulp.src(dist + '/assets/rev-manifest.json');
|
|
|
|
return gulp.src(dist + '/**/*.{html,xml,txt,json,css,js,png,jpg,jpeg,svg,eot,ttf,woff}')
|
|
.pipe($.revReplace({ manifest: manifest }))
|
|
.pipe(gulp.dest(dist));
|
|
});
|
|
|
|
|
|
//
|
|
// CDN url injection
|
|
//
|
|
gulp.task('cdn', function() {
|
|
return gulp.src([dist + '/**/*.html', dist + '/assets/css/*.css'], { base: dist })
|
|
.pipe($.replace('/assets/css/', cdn + '/assets/css/'))
|
|
.pipe($.replace('/assets/js/', cdn + '/assets/js/'))
|
|
//.pipe($.replace('/assets/img/', cdn + '/assets/img/'))
|
|
.pipe($.replace('/media/', cdn + '/media/'))
|
|
.pipe($.replace('https://kremalicious.com' + cdn + '/media/', 'https://kremalicious.com/media/'))
|
|
.pipe($.replace('../', cdn + '/assets/'))
|
|
.pipe(gulp.dest(dist));
|
|
});
|
|
|
|
|
|
//
|
|
// Dev Server
|
|
//
|
|
gulp.task('connect', function() {
|
|
return $.connect.server({
|
|
root: [dist],
|
|
livereload: true,
|
|
port: 1337
|
|
});
|
|
});
|
|
|
|
//
|
|
// Watch task
|
|
//
|
|
gulp.task('watch', function() {
|
|
gulp.watch([src + '/_assets/styl/**/*.styl'], ['css']);
|
|
gulp.watch([src + '/_assets/js/*.js'], ['js-project']);
|
|
gulp.watch([src + '/_assets/img/**/*.{png,jpg,jpeg,gif}'], ['images']);
|
|
gulp.watch([src + '/_assets/img/**/*.{svg}'], ['icons']);
|
|
gulp.watch([src + '/_media/**/*'], ['media']);
|
|
gulp.watch([src + '/**/*.{html,xml,json,txt,md}'], ['jekyll-build']);
|
|
});
|
|
|
|
// ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
|
|
// Task sequences
|
|
// ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
|
|
|
|
gulp.task('jekyll-build', function(cb) {
|
|
runSequence(
|
|
'jekyll',
|
|
['css', 'js', 'images', 'fonts', 'media', 'icons'],
|
|
cb
|
|
);
|
|
});
|
|
|
|
//
|
|
// Dev Server
|
|
//
|
|
gulp.task('default', function(cb) {
|
|
runSequence(
|
|
'clean',
|
|
'jekyll-build',
|
|
'watch',
|
|
'connect',
|
|
cb
|
|
);
|
|
});
|
|
|
|
//
|
|
// Production build
|
|
//
|
|
gulp.task('build', function(cb) {
|
|
runSequence(
|
|
'clean',
|
|
'jekyll:production',
|
|
['css', 'js', 'images', 'fonts', 'media'],
|
|
'icons',
|
|
'svg-fallbacks',
|
|
'revision',
|
|
'revision-replace',
|
|
'cdn',
|
|
'optimize:html',
|
|
'optimize:images',
|
|
cb
|
|
);
|
|
});
|