Сергей delphinpro

const gulp = require('gulp');
const gulpHtml = require('gulp-html');
const webpackStream = require('webpack-stream');
const gulpAutoprefix = require('gulp-autoprefixer');
const gulpSass = require('gulp-sass');
const gulpWatch = require('gulp-watch');
const gulpSourceMap = require('gulp-sourcemaps');
const browserSync = require('browser-sync').create();
const gulpStylelint = require('gulp-stylelint');
const gulpImage = require('gulp-image');
const historyFallback = require('connect-history-api-fallback');
const webpackConfig = require('./webpack.config.js');

export const stylesheets = () => {
  return gulp.src('./src/scss/**/*.scss')
    .pipe(gulpStylelint({
      failAfterError: false,
      reporters     : [
        {
          formatter: 'string',
          console  : true,
          fix      : true,
        },
      ],
    }))
    .pipe(gulpSourceMap.init())
    .pipe(gulpSass({
      outputStyle: 'compressed',
    })).on('error', gulpSass.logError)
    .pipe(gulpAutoprefix({
      browsers: ['last 2 versions'],
    }))
    .pipe(gulpSourceMap.write())
    .pipe(gulp.dest('./dev/css/'))
    .pipe(browserSync.stream());
};

export const stylesheetsProduction = () => {
  return gulp.src('./src/scss/**/*.scss')
    .pipe(gulpStylelint({
      failAfterError: true,
      reporters     : [
        {
          formatter: 'string',
          console  : true,
          fix      : true,
        },
      ],
    }))
    .pipe(gulpSass({
      outputStyle: 'compressed',
    })).on('error', gulpSass.logError)
    .pipe(gulpAutoprefix({
      browsers: ['last 2 versions'],
    }))
    .pipe(gulp.dest('./build/css/'));
};

export const js = () => {
  return gulp.src('./src/js/main.js')
    .pipe(webpackStream(webpackConfig))
    .pipe(gulp.dest('./dev/js'))
    .pipe(browserSync.stream());
};

export const jsProduction = () => {
  webpackConfig.watch = false;

  gulp.src('./src/js/main.js')
    .pipe(webpackStream(webpackConfig))
    .pipe(gulp.dest('./build/js'));
};

export const image = () => {
  return gulp.src('./src/images/*')
    .pipe(gulpImage())
    .pipe(gulp.dest('./dev/images'))
    .pipe(browserSync.stream());
};

export const imageProduction = () => {
  return gulp.src('./src/images/*')
    .pipe(gulpImage())
    .pipe(gulp.dest('./build/images'));
};

export const html = () => {
  return gulp.src('./src/template/**/*.html')
    .pipe(gulpHtml())
    .pipe(gulp.dest('./dev'))
    .pipe(browserSync.stream());
};

export const htmlProduction = () => {
  return gulp.src('./src/template/**/*.html')
    .pipe(gulpHtml())
    .pipe(gulp.dest('./build'));
};

const watch = () => {
  gulpWatch(['./src/scss/**/*.scss'], () => {
    gulp.start('stylesheets');
  });
  gulpWatch(['./src/images/**/*'], () => {
    gulp.start('image');
  });
  gulpWatch(['./src/template/**/*.html'], () => {
    gulp.start('html');
  });
};

const server = () => {
  return gulp.series(function () {
    browser.init({
      server: {
        baseDir   : './dev',
        middleware: [
          historyFallback(),
        ],
      },
      open  : true,
      port  : 8080,
    });
  });
};

// ХЗ что это такое....
// gulp.task('server', gulp.series('build', function () {
//   browser.init({
//     server: {
//       baseDir   : './dev',
//       middleware: [
//         historyFallback(),
//       ],
//     },
//     open  : true,
//     port  : 8080,
//   });
// }));

export const development = gulp.series(
  gulp.parallel(
    stylesheets,
    js,
    image,
    html,
  ),
  gulp.parallel(
    watch,
    server,
  ),
);

export const production = gulp.parallel(
  stylesheetsProduction,
  jsProduction,
  imageProduction,
  htmlProduction,
);

const path = require('path');

const bs      = require('browser-sync');
const webpack = require('webpack');

const config      = require('../../gulp.config');
const tools       = require('../lib/tools');
const DEVELOPMENT = require('../lib/checkMode').isDevelopment();

let webpackConfig = require(path.join(config.root.main, 'webpack.config.js'));

function showInfo(err, stats) {
  // эту функцию приводить не буду. просто вывод ошибок в консоль
}

module.exports = function (options = {}) {

    options = {
        watch: false,
        ...options,
    };

    return function (done) {

        const compiler = webpack(webpackConfig);

        if (options.watch) {
            tools.info('Webpack watching...');

            compiler.watch({
                ignored         : /node_modules/,
                aggregateTimeout: 300,
            }, (err, stats) => {

                showInfo(err, stats);

                if (DEVELOPMENT && bs.has(config.browserSync.instanceName)) {
                    bs.get(config.browserSync.instanceName).reload();
                }
            });

        } else {

            compiler.run((err, stats) => {
                showInfo(err, stats);
                done();
            });

        }

    };
};