Old Gulp

const { src, dest, parallel, series, watch } = require('gulp');
const sass = require('gulp-sass');
const sasslint = require('gulp-sass-lint');
const prefix = require('gulp-autoprefixer');
const sourcemaps = require('gulp-sourcemaps');
const concat = require('gulp-concat');
const browsersync = require('browser-sync');
const del = require('del');
const kit = require('gulp-kit-2');
const rename = require('gulp-rename');
const jsimport = require('gulp-js-import-file');
const copy = require('gulp-copy');
const paths = {};

paths.assets = './dist/';

// Kit file compilation
function html() {
    return src(['src/templates/*.kit'], del('dist/*.html'))
    .pipe(kit())
    .pipe(dest(paths.assets));
}

// SCSS bundled into CSS task
function lintsass() {
    return src([
        'src/scss/**/*.scss',
        '!src/scss/_fonts.scss',
        '!src/scss/_normalize.scss',
        '!src/scss/_overrides.scss',
        '!src/scss/_boilerplate.scss',
        '!src/scss/vendor/**/*.scss'
    ])
    .pipe(sasslint({
        configFile: 'src/scss/.sasslintrc'
    }))
    .pipe(sasslint.format())
    .pipe(sasslint.failOnError())
}
function css() {
    return src('src/scss/**/*.scss')
    .pipe(sourcemaps.init())
    .pipe(sourcemaps.init({ loadMaps: true }))
    .pipe(sass({
        outputStyle: 'compressed'
    })
    .on('error', sass.logError))
    .pipe(prefix())
    .pipe(sourcemaps.write('maps', {
        sourceMappingURL: function (file) {
            return 'maps/' + file.relative + '.min.map';
        }
    }))
    .pipe(rename({ suffix: '.min' }))
    .pipe(dest(paths.assets + 'css'));
}

//Copy fonts
function copyfonts() {
    return src(['src/scss/fonts/**/*.*'], del(paths.assets + 'css/fonts/*'))
    .pipe(dest(paths.assets + 'css/fonts'));
}

//Copy CSS images
function copyimg() {
    return src(['src/scss/img/**/*.*'], del(paths.assets + 'css/img/*'))
    .pipe(dest(paths.assets + 'css/img'));
}

//Copy FPO images
function fpoimg() {
    return src(['src/templates/img-fpo/**/*.*'], del(paths.assets + 'img-fpo/*'))
    .pipe(dest(paths.assets + 'img-fpo'));
}

//Copy Media images
function mediaimg() {
    return src(['src/templates/media/**/*.*'], del(paths.assets + 'media/*'))
    .pipe(dest(paths.assets + 'media'));
}

//Copy JS vendor
function copyjsvendor() {
    return src('src/js/vendor/*.js')
    .pipe(dest(paths.assets + 'js/vendor'));
}

// JS bundled into min.js task
function js() {
    return src('src/js/*.js')
    .pipe(jsimport({
        hideConsole: true,
    importStack: true,
    es6import: true
    }))
    .pipe(dest(paths.assets + 'js/'));
}

// BrowserSync
function browserSync() {
    browsersync({
        server: {
            baseDir: './dist/'
        },
        notify: {
            styles: {
                top: '0',
                bottom: 'auto',
                margin: '0px',
                padding: '5px',
                position: 'fixed',
                fontSize: '12px',
                zIndex: '9999',
                borderRadius: '0',
                color: 'white',
                textAlign: 'center',
                display: 'block',
                backgroundColor: 'rgba(0, 0, 0, 0.5)'
            }
        }
    });
}

// Copy DIST folder to Static Repo
function copystatic() {
    return src(['dist/**/**'])
        .pipe(copy('../../../../FE_Static/McAlisters'));
}

// BrowserSync reload
function browserReload() {
    return browsersync.reload;
    done();
}

// Watch files
function watchFiles() {
    // Watch all design changes
    watch('src/scss/**/*.*', parallel(lintsass, css, copyfonts, copyimg, mediaimg))
        .on('change', browserReload());
    // Watch javascripts changes
    watch('src/js/**/*.js', parallel(js))
        .on('change', browserReload());
    // Watch template changes
    watch('src/templates/**/*.*', parallel(html, fpoimg))
        .on('change', browserReload());
}

const watching = parallel(watchFiles, browserSync);

exports.copystatic = copystatic;
exports.html = html;
exports.lintsass = lintsass;
exports.js = js;
exports.css = css;
exports.copyimg = copyimg;
exports.copyjsvendor = copyjsvendor;
exports.mediaimg = mediaimg;
exports.copyfonts = copyfonts;
exports.fpoimg = fpoimg;
exports.default = parallel(watching, html, css, js, copyimg, copyjsvendor, copyfonts, fpoimg, lintsass, mediaimg);