This repository has been archived on 2020-05-08. You can view files and clone it, but cannot push or open issues or pull requests.
understrap/gulpfile.js

190 lines
6.4 KiB
JavaScript
Raw Permalink Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

// Defining requirements
var autoprefixer = require( 'autoprefixer' ),
browserSync = require('browser-sync').create(),
cleanCSS = require( 'gulp-clean-css' ),
concat = require( 'gulp-concat' ),
del = require( 'del' ),
gulp = require( 'gulp' ),
imagemin = require( 'gulp-imagemin' ),
postcss = require( 'gulp-postcss' ),
rename = require( 'gulp-rename' ),
replace = require( 'gulp-replace' ),
sass = require( 'gulp-sass' ),
sourcemaps = require( 'gulp-sourcemaps' ),
uglify = require( 'gulp-uglify' ),
rev = require('gulp-rev'),
revDel = require('rev-del');
// Configuration file to keep your code DRY
const cfg = require( './gulpconfig.json' );
const paths = cfg.paths;
// Compile SCSS to CSS
function scss( ) {
return gulp.src( paths.sass + '/*.scss' )
.pipe(sourcemaps.init({loadMaps: true}))
.pipe(sass()).on('error', sass.logError)
.pipe(postcss([
autoprefixer()
]))
.pipe(sourcemaps.write(undefined, { sourceRoot: null }))
.pipe( gulp.dest( paths.css ) );
}
exports.scss = scss;
// Minify CSS
function minifycss( ) {
return gulp.src( paths.css + '/theme.css' )
.pipe( sourcemaps.init( { loadMaps: true } ) )
.pipe( cleanCSS( { compatibility: '*' } ) )
.pipe( rename( { suffix: '.min' } ) )
.pipe( sourcemaps.write( './' ) )
.pipe( gulp.dest( paths.css ) )
gulp.src( paths.css + '/custom-editor-style.css' )
.pipe( sourcemaps.init( { loadMaps: true } ) )
.pipe( cleanCSS( { compatibility: '*' } ) )
.pipe( rename( { suffix: '.min' } ) )
.pipe( sourcemaps.write( './' ) )
.pipe( gulp.dest( paths.css ) );
};
exports.minifycss = minifycss;
// Concatinate scripts and minify them
function scripts( done ) {
var scripts = [
paths.dev + '/js/bootstrap4/bootstrap.js',
paths.dev + '/js/skip-link-focus-fix.js',
// Adding currently empty javascript file to add on for your own themes´ customizations
// Please add any customizations to this .js file only!
paths.dev + '/js/custom-javascript.js'
];
gulp.src( scripts )
.pipe( concat( 'theme.js' ) )
.pipe( gulp.dest( paths.js ) )
gulp.src( scripts )
.pipe( concat( 'theme.min.js' ) )
.pipe( uglify() )
.pipe( gulp.dest( paths.js ) );
revision();
}
exports.scripts = scripts;
// Compress image assets
function imagemin() {
return gulp.src( paths.imgsrc + '/**' )
.pipe( imagemin() )
.pipe( gulp.dest( paths.img ) );
}
exports.imagemin = imagemin;
// Run:
// gulp copy-assets.
// Copy all needed dependency assets files from bower_component assets to themes /js, /scss and /fonts folder. Run this task after bower install or bower update
////////////////// All Bootstrap SASS Assets /////////////////////////
gulp.task( 'copy-assets', function(done) {
////////////////// All Bootstrap 4 Assets /////////////////////////
// Copy all JS files
gulp.src( paths.node + 'bootstrap/dist/js/**/*.js' )
.pipe( gulp.dest( paths.dev + '/js/bootstrap4' ) );
// Copy all Bootstrap SCSS files
gulp.src( paths.node + 'bootstrap/scss/**/*.scss' )
.pipe( gulp.dest( paths.dev + '/sass/bootstrap4' ) );
////////////////// End Bootstrap 4 Assets /////////////////////////
// Copy all Font Awesome Fonts
gulp.src( paths.node + 'font-awesome/fonts/**/*.{ttf,woff,woff2,eot,svg}' )
.pipe( gulp.dest( './fonts' ) );
// Copy all Font Awesome SCSS files
gulp.src( paths.node + 'font-awesome/scss/*.scss' )
.pipe( gulp.dest( paths.dev + '/sass/fontawesome' ) );
// _s SCSS files
gulp.src( paths.node + 'undescores-for-npm/sass/media/*.scss' )
.pipe( gulp.dest( paths.dev + '/sass/underscores' ) );
// _s JS files into /src/js
gulp.src( paths.node + 'undescores-for-npm/js/skip-link-focus-fix.js' )
.pipe( gulp.dest( paths.dev + '/js' ) );
// Copy Popper JS files
gulp.src( paths.node + 'popper.js/dist/umd/popper.min.js' )
.pipe( gulp.dest( paths.js + paths.vendor ) );
gulp.src( paths.node + 'popper.js/dist/umd/popper.js' )
.pipe( gulp.dest( paths.js + paths.vendor ) );
done();
});
// Deleting any file inside the /src folder
gulp.task( 'clean-source', function() {
return del( ['src/**/*', '!src'] );
});
// Deleting any file inside the /dist folder
gulp.task( 'clean-dist', function() {
return del( ['dist/**/*', '!dist'] );
});
function revision( done ) {
// by default, gulp would pick `assets/css` as the base,
// so we need to set it explicitly:
return gulp.src([paths.css + '/theme.min.css', paths.js + '/theme.min.js'], {base: './'})
.pipe(rev())
.pipe(gulp.dest('./')) // write rev'd assets to build dir
.pipe(rev.manifest())
.pipe(revDel({dest: './', force: true}))
.pipe(gulp.dest('./')); // write manifest to build dir
done();
};
exports.revision = revision;
// Run
// gulp dist
// Copies the files to the /dist folder for distribution as simple theme
gulp.task( 'dist', gulp.series( 'clean-dist', function(done) {
gulp.src( ['**/*', '!' + paths.bower, '!' + paths.bower + '/**', '!' + paths.node, '!' + paths.node + '/**', '!' + paths.dev, '!' + paths.dev + '/**', '!' + paths.dist, '!' + paths.dist + '/**', '!' + paths.distprod, '!' + paths.distprod + '/**', '!' + paths.sass, '!' + paths.sass + '/**', '!readme.txt', '!readme.md', '!package.json', '!package-lock.json', '!gulpfile.js', '!gulpconfig.json', '!CHANGELOG.md', '!.travis.yml', '!jshintignore', '!codesniffer.ruleset.xml', 'rev-manifest.json', '*'], { 'buffer': false } )
.pipe( replace( '/js/jquery.slim.min.js', '/js' + paths.vendor + '/jquery.slim.min.js', { 'skipBinary': true } ) )
.pipe( replace( '/js/popper.min.js', '/js' + paths.vendor + '/popper.min.js', { 'skipBinary': true } ) )
.pipe( gulp.dest( paths.dist ) );
done();
}));
// BrowserSync reload helper function
function reload( done ){
browserSync.reload();
done();
}
// BrowserSync main task
gulp.task( 'watch-bs', function( done ) {
browserSync.init( cfg.browserSyncWatchFiles, cfg.browserSyncOptions );
gulp.watch( paths.sass + '/**/*.scss', gulp.series( scss, minifycss, revision, reload ) );
gulp.watch( [paths.dev + '/js/**/*.js', 'js/**/*.js', '!js/theme.js', '!js/theme.min.js'], gulp.series( scripts, reload ) );
//Inside the watch task.
gulp.watch( paths.imgsrc + '/**', gulp.series( imagemin, reload ) );
done();
});