sp-magic.de/gulpfile.js

/**
 * Settings
 * Turn on/off build features
 */
var settings = {
    clean: true,
    styles: true,
    copy: true,
    reload: true
};


/**
 * Paths to project folders
 */
var paths = {
    input: 'src/',
    output: 'dist/',
    styles: {
        input: 'src/scss/*.scss',
        output: 'dist/css/'
    },
    copy: {
        input: [
            'src/*.html',
//            'src/.htaccess',
            'src/{img,font}/**/*',
            'node_modules/@fortawesome/fontawesome-free/*fonts/**/*'
        ],
        output: 'dist/'
    },
    reload: './dist/'
};


/**
 * Template for banner to add to file headers
 */

var banner = {
    main:
        '/*!' +
        ' <%= package.name %> v<%= package.version %>' +
        ' | (c) ' + new Date().getFullYear() + ' <%= package.author.name %>' +
        ' | <%= package.license %> License' +
        ' | <%= package.repository.url %>' +
        ' */\n'
};


/**
 * Gulp Packages
 */
// General
var {src, dest, watch, series, parallel} = require('gulp');
var del = require('del');
var rename = require('gulp-rename');
var header = require('gulp-header');
var package = require('./package.json');

// Styles
var sass = require('gulp-sass')(require('sass'));
var postcss = require('gulp-postcss');
var prefix = require('autoprefixer');
var minify = require('cssnano');
var tildeImporter = require('node-sass-tilde-importer');

// BrowserSync
var browserSync = require('browser-sync');


/**
 * Gulp Tasks
 */
// Remove pre-existing content from output folders
var cleanDist = function (done) {

    // Make sure this feature is activated before running
    if (!settings.clean) return done();

    // Clean the dist folder
    del.sync([
        paths.output
    ]);

    // Signal completion
    return done();

};

// Process, and minify Sass files
var buildStyles = function (done) {
    // Make sure this feature is activated before running
    if (!settings.styles) return done();

    // Run tasks on all Sass files
    return src(paths.styles.input)
        .pipe(sass({
            importer: tildeImporter,
            outputStyle: 'expanded',
            sourceComments: true
        }))
        .pipe(postcss([
            prefix({
                cascade: true,
                remove: true
            })
        ]))
        .pipe(header(banner.main, {package: package}))
        .pipe(dest(paths.styles.output))
        .pipe(rename({suffix: '.min'}))
        .pipe(postcss([
            minify({
                discardComments: {
                    removeAll: true
                }
            })
        ]))
        .pipe(dest(paths.styles.output));

};

// Copy static files into output folder
var copyFiles = function (done) {

    // Make sure this feature is activated before running
    if (!settings.copy) return done();

    // Copy static files
    return src(paths.copy.input)
        .pipe(dest(paths.copy.output));

};

// Watch for changes to the src directory
var startServer = function (done) {
    // Make sure this feature is activated before running
    if (!settings.reload) return done();

    // Initialize BrowserSync
    browserSync.init({
        server: {
            baseDir: paths.reload
        }
    });

    // Signal completion
    done();

};

// Reload the browser when files change
var reloadBrowser = function (done) {
    if (!settings.reload) return done();
    browserSync.reload();
    done();
};

// Watch for changes
var watchSource = function (done) {
    watch(paths.input, series(exports.default, reloadBrowser));
    done();
};


/**
 * Export Tasks
 */
// Default task
// gulp
exports.default = series(
    cleanDist,
    parallel(
        buildStyles,
        copyFiles
    )
);

// Watch and reload
// gulp watch
exports.watch = series(
    exports.default,
    startServer,
    watchSource
);