@sgalinski/responsive-side-menu/gulpfile.js

A simple and extendable slide-in menu

'use strict';

const gulp = require('gulp'),
	autoprefixer = require('gulp-autoprefixer'),
	sourcemaps = require('gulp-sourcemaps'),
	sass = require('gulp-sass'),
	browserify = require('browserify'),
	babelify = require('babelify'),
	source = require('vinyl-source-stream'),
	streamify = require('gulp-streamify'),
	eslint = require('gulp-eslint'),
	uglify = require('gulp-uglify'),
	browserSync = require('browser-sync').create();

gulp.task('sass', () => {
	return gulp.src('./src/sass/**/*.scss')
		.pipe(sourcemaps.init())
		.pipe(autoprefixer({
			browsers: [
				'> 1%',
				'last 2 versions'
			]
		}))
		.pipe(sass().on('error', sass.logError))
		.pipe(sourcemaps.write('.'))
		.pipe(gulp.dest('./dist/'))
		.pipe(browserSync.stream({match: '**/*.css'}));
});

gulp.task('js:compile', () => {
	return browserify({
		entries: ['./src/js/main.js'],
		standalone: 'ResponsiveSideMenu',
		debug: true
	})
		.transform('babelify', {
			presets: ['es2015']
		})
		.bundle()
		.pipe(source('responsive-side-menu.js'))
		.pipe(streamify(sourcemaps.init({loadMaps: true})))
		.pipe(streamify(uglify()))
		.pipe(streamify(sourcemaps.write('.')))
		.pipe(gulp.dest('./dist/'))
		.pipe(browserSync.stream());
});

gulp.task('js:qa', () => {
	return gulp.src('./src/js/**/*.js')
		.pipe(eslint())
		.pipe(eslint.format())
});

gulp.task('js', gulp.series(['js:qa', 'js:compile']));

gulp.task('server', () => {
	browserSync.init({
		server: {
			baseDir:  './'
		},
		startPath: '/demo/'
	});

	gulp.watch('./src/sass/**/*.scss', gulp.series('sass'));
	gulp.watch('./src/js/**/*.js', gulp.series('js'));
	gulp.watch('./demo/index.html').on('change', browserSync.reload);
});

gulp.task('default', gulp.series(gulp.parallel('sass', 'js'), 'server'));
gulp.task('compile', gulp.series(gulp.parallel('sass', 'js')));