Last active
March 19, 2017 02:14
-
-
Save PaulMorel/d42c74464a5a7f09f473bc332c7e0210 to your computer and use it in GitHub Desktop.
Latest Gulpfile
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
/*jslint node: true */ | |
'use strict'; | |
// ============================================================================ | |
// Config | |
// ============================================================================ | |
var config = { | |
projectName: 'Fraicheur Locale', | |
browserSync: true, | |
basePath: { | |
src: 'assets/', | |
dev: '../dev/assets/', | |
theme: '../dev/', | |
url: '', | |
proxy: 'http://localhost/' | |
} | |
}; | |
// ============================================================================ | |
// Load Packages | |
// ============================================================================ | |
// ============================================================================ | |
// Load Packages | |
// ============================================================================ | |
console.time("Loaded Plugins"); // Start Measuring | |
// General | |
var gulp = require('gulp'), | |
rename = require('gulp-rename'), | |
plumber = require('gulp-plumber'); | |
// Styles | |
var sass = require('gulp-sass'), | |
autoprefixer = require('gulp-autoprefixer'), | |
sourcemaps = require('gulp-sourcemaps'), | |
cssnano = require('gulp-cssnano'), | |
cmq = require('gulp-combine-mq'), | |
uncss = require('gulp-uncss'); | |
// Javascript | |
var uglify = require('gulp-uglify'), | |
concat = require('gulp-concat'); | |
// Images | |
var imagemin = require('gulp-imagemin'); | |
var svgsprite = require('gulp-svg-sprite'); | |
// Browser Sync | |
var browserSync = require('browser-sync').create( config.projectName ); | |
console.timeEnd("Loaded Plugins"); // Stop Measuring | |
// ============================================================================ | |
// Task Configuration | |
// ============================================================================ | |
function onError(error) { | |
console.log(error); | |
this.emit('end'); | |
} | |
// -------------------------------------------------------- | |
// Styles | |
// -------------------------------------------------------- | |
// | |
// SASS Compiler, Source Maps, Autoprefixer | |
// | |
function compileSCSS() { | |
return gulp.src(config.basePath.src + 'scss/{,*/}/*.scss') | |
.pipe(plumber({ | |
errorHandler: onError | |
})) | |
.pipe(sourcemaps.init()) | |
.pipe(sass()) | |
.pipe(autoprefixer({ | |
browsers: ['last 4 versions', 'ie >= 10', 'and_chr >= 2.3'], | |
cascade: false | |
})) | |
.pipe(sourcemaps.write('./')) | |
.pipe( gulp.dest( config.basePath.dev + 'css/' ) ) | |
.pipe( browserSync.stream({match: "**/*.css"}) ); | |
} | |
// | |
// Minifier | |
// | |
function minifyCSS() { | |
return gulp.src([ | |
config.basePath.dev + 'css/*.css', | |
'!' + config.basePath.dev + 'css/*.min.css' | |
]) | |
.pipe(plumber({ | |
errorHandler: onError | |
})) | |
.pipe(rename({ | |
suffix: '.min' | |
})) | |
.pipe(cmq({ | |
beautify: false | |
})) | |
.pipe(cssnano()) | |
.pipe(gulp.dest(config.basePath.dev + 'css/')) | |
.pipe(browserSync.stream({ | |
match: "**/*.css" | |
})); | |
} | |
// | |
// UnCSS | |
// | |
// gulp.task('styles:uncss', function() { | |
// return gulp.src(config.basePath.dev + 'css/*.css') | |
// .pipe(plumber(function(error) { | |
// util.log(util.colors.red(error.message)); | |
// this.emit('end'); | |
// })) | |
// .pipe(rename({ | |
// suffix: '.min' | |
// })) | |
// .pipe(uncss({ | |
// html: request({ | |
// url: config.basePath.url, | |
// json: true | |
// }, function(error, response, body) { | |
// | |
// if (!error && response.statusCode === 200) { | |
// console.log(body) // Print the json response | |
// } else { | |
// | |
// } | |
// }) | |
// })) | |
// .pipe(cssnano()) | |
// .pipe(gulp.dest(config.basePath.dev + 'css/')); | |
// }); | |
// -------------------------------------------------------- | |
// Javascript | |
// -------------------------------------------------------- | |
// | |
// Concatenation & Uglify Javascript | |
// | |
function concatJS() { | |
return gulp.src([ | |
config.basePath.src + 'js/*.js' | |
]) | |
.pipe(plumber({ | |
errorHandler: onError | |
})) | |
.pipe(concat('global.js')) | |
.pipe(gulp.dest(config.basePath.dev + 'js/')) | |
.pipe(rename({ | |
suffix: '.min' | |
})) | |
.pipe(uglify()) | |
.pipe(gulp.dest(config.basePath.dev + '/js')) | |
//.pipe( browserSync.reload ); | |
} | |
// | |
// Concatenation & Uglify Foundation Javascript | |
// | |
// function foundationJS() { | |
// return gulp.src([ | |
// // Foundation core - needed if you want to use any of the components below | |
// config.basePath.src + 'vendor/foundation-sites/js/foundation.core.js', | |
// config.basePath.src + 'vendor/foundation-sites/js/foundation.util.*.js', | |
// | |
// // Pick the components you need in your project | |
// // config.basePath.src + 'vendor/foundation-sites/js/foundation.abide.js', | |
// // config.basePath.src + 'vendor/foundation-sites/js/foundation.accordion.js', | |
// // config.basePath.src + 'vendor/foundation-sites/js/foundation.accordionMenu.js', | |
// // config.basePath.src + 'vendor/foundation-sites/js/foundation.drilldown.js', | |
// config.basePath.src + 'vendor/foundation-sites/js/foundation.dropdown.js', | |
// config.basePath.src + 'vendor/foundation-sites/js/foundation.dropdownMenu.js', | |
// config.basePath.src + 'vendor/foundation-sites/js/foundation.equalizer.js', | |
// // config.basePath.src + 'vendor/foundation-sites/js/foundation.interchange.js', | |
// // config.basePath.src + 'vendor/foundation-sites/js/foundation.magellan.js', | |
// // config.basePath.src + 'vendor/foundation-sites/js/foundation.offcanvas.js', | |
// // config.basePath.src + 'vendor/foundation-sites/js/foundation.orbit.js', | |
// // config.basePath.src + 'vendor/foundation-sites/js/foundation.responsiveMenu.js', | |
// // config.basePath.src + 'vendor/foundation-sites/js/foundation.responsiveToggle.js', | |
// // config.basePath.src + 'vendor/foundation-sites/js/foundation.reveal.js', | |
// // config.basePath.src + 'vendor/foundation-sites/js/foundation.slider.js', | |
// // config.basePath.src + 'vendor/foundation-sites/js/foundation.sticky.js', | |
// // config.basePath.src + 'vendor/foundation-sites/js/foundation.tabs.js', | |
// // config.basePath.src + 'vendor/foundation-sites/js/foundation.toggler.js', | |
// // config.basePath.src + 'vendor/foundation-sites/js/foundation.tooltip.js', | |
// ]) | |
// .pipe(concat('foundation.js')) | |
// .pipe(gulp.dest(config.basePath.dev + '/js')) | |
// .pipe(rename({ | |
// suffix: '.min' | |
// })) | |
// .pipe(uglify()) | |
// .pipe(gulp.dest(config.basePath.dev + '/js')); | |
// } | |
// -------------------------------------------------------- | |
// Images | |
// -------------------------------------------------------- | |
// | |
// Image Compression | |
// | |
function compressImages() { | |
return gulp.src([ | |
config.basePath.src + 'img/{,*/}*.{png,jpg,gif,svg}', | |
'!' + config.basePath.src + 'img/icons/*', // Negated Folder | |
]) | |
.pipe(plumber({ | |
errorHandler: onError | |
})) | |
.pipe(imagemin({ | |
optimizationLevel: 4, | |
multipass: true | |
})) | |
.pipe(gulp.dest(config.basePath.dev + 'img/')); | |
} | |
// | |
// SVG Sprites | |
// | |
function createSprite() { | |
return gulp.src( | |
config.basePath.src + 'img/icons/*.svg' | |
) | |
.pipe(plumber({ | |
errorHandler: onError | |
})) | |
.pipe(svgsprite({ | |
log: 'info', | |
shape: { | |
id: { | |
whitespace: '-' | |
}, | |
dimension: { | |
precision: 0, | |
attributes: true | |
}, | |
transform: [{ | |
svgo: { | |
plugins : [ | |
{transformsWithOnePath: { | |
floatPrecision: 0, | |
}}, | |
{collapseGroups: true}, | |
{sortAttrs: true}, | |
{cleanupIDs: true}, | |
{removeTitle: false}, | |
{convertPathData: true}, | |
{cleanupNumericValues: { | |
floatPrecision: 0, | |
}}, | |
] | |
} | |
}] | |
}, | |
svg: { | |
xmlDeclaration: false, | |
doctypeDeclaration: false, | |
precision: 1, | |
}, | |
mode: { | |
css: { | |
dest: './', | |
bust: false, | |
prefix: '.icon-%s', | |
sprite: '../img/sprite.svg', | |
dimensions: true, | |
render: { | |
scss: { | |
dest: '../scss/_sprite.scss' | |
} | |
} | |
} | |
} | |
})) | |
.pipe(gulp.dest(config.basePath.src + 'img/')); | |
} | |
// -------------------------------------------------------- | |
// Watch | |
// -------------------------------------------------------- | |
function watch() { | |
if (config.browserSync === true ) { | |
browserSync.init({ | |
files: [config.basePath.theme], | |
injectChanges: true, | |
proxy: config.basePath.proxy, | |
snippetOptions: { | |
ignorePaths: ["/wp-admin/**"] | |
}, | |
}); | |
} else { | |
console.log('Browser Sync Disabled'); | |
} | |
// Watch .scss files | |
gulp.watch(config.basePath.src + 'scss/{,*/}*.scss', compileSCSS ); | |
// Watch js files | |
gulp.watch(config.basePath.src + 'js/*.js', concatJS ); | |
// gulp.watch(config.basePath.src + 'vendor/foundation-sites/js/*.js', foundationJS ); | |
// Images | |
gulp.watch([ | |
config.basePath.src + 'img/{,*/}*.{png,jpg,gif,svg}', | |
'!' + config.basePath.src + 'img/icons/*' | |
], compressImages ); | |
gulp.watch(config.basePath.src + 'img/icons/*.svg', gulp.series(createSprite, compileSCSS) ); | |
// console.log('Watching files...'); | |
} | |
// ============================================================================ | |
// Task Registration | |
// ============================================================================ | |
gulp.task(compileSCSS); | |
gulp.task(minifyCSS); | |
gulp.task(concatJS); | |
// gulp.task(foundationJS); | |
gulp.task('js', gulp.parallel(concatJS)); | |
gulp.task(compressImages); | |
gulp.task(createSprite); | |
gulp.task('images', gulp.series(createSprite, compressImages, compileSCSS)); | |
gulp.task('default', watch); | |
gulp.task(watch); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment