gulpfile.js

// "use strict";
//
// var gulp = require("gulp");
// var sass = require("gulp-sass");
// var plumber = require("gulp-plumber");
// var postcss = require("gulp-postcss");
// var autoprefixer = require("autoprefixer");
// var server = require("browser-sync").create();
// var csso = require("gulp-csso");
// var rename = require("gulp-rename");
// var imagemin = require("gulp-imagemin");
// var webp = require("gulp-webp");
// var svgstore = require("gulp-svgstore");
// var posthtml = require("gulp-posthtml");
// var include = require("posthtml-include");
// var del = require("del");
//
// gulp.task("delete", function(){
//   return del("build");
// });
//
// gulp.task("css", function() {
//   return gulp.src("source/sass/style.scss")
//     .pipe(plumber())
//     .pipe(sass())
//     .pipe(postcss([
//       autoprefixer()
//     ]))
//     .pipe(gulp.dest("build/css"))
//     .pipe(csso())
//     .pipe(rename("style-min.css"))
//     .pipe(gulp.dest("build/css"))
//     .pipe(server.stream());
// });
//
// gulp.task("images", function() {
//     return gulp.src("source/img/**/*.{png,jpg,svg}")
//     .pipe(imagemin([
//       imagemin.optipng({optimizationLevel:3}),
//       imagemin.jpegtran({progressive:true}),
//       imagemin.svgo()
//     ]))
//     .pipe(gulp.dest("source/img"));
// });
//
// gulp.task("webp", function() {
//   return gulp.src("source/img/**/*.{png,jpg}")
//     .pipe(webp({quality: 90}))
//     .pipe(gulp.dest("source/img"));
// });
//
// gulp.task("sprite", function() {
//   return gulp.src("source/img/icon-*.svg")
//   .pipe(svgstore({
//     inlineSvg:true
//   }))
//   .pipe(rename("sprite.svg"))
//   .pipe(gulp.dest("build/img"));
// });
//
// gulp.task("html", function() {
//   return gulp.src("source/*.html")
//   // .pipe(posthtml([
//   //   include()
//   // ]))
//   .pipe(gulp.dest("build"));
// })
//
// gulp.task("copy", function(){
//   return gulp.src([
//     // "source/fonts/**/*.{woff,woff2}",
//     "source/img/**",
//     "source/js/**"
//   ], {
//     base: "source"
//   })
//   .pipe(gulp.dest("build"));
// });
//
// gulp.task("server", function () {
//   server.init({
//     server: "build",
//     notify: false,
//     open: true,
//     cors: true,
//     ui: false
//   });
//
//   gulp.watch("source/sass/**/*.{scss,sass}", gulp.series("css"));
//   gulp.watch("source/img/icon-*.svg", gulp.series("sprite", "refresh"))
//   gulp.watch("source/*.html", gulp.series("html", "refresh"));
// });
//
// gulp.task("reload", function(done) {
//   server.reload();
//   done();
// });
//
// gulp.task("build", gulp.series(
//   "delete",
//   "copy",
//   "css",
//   "sprite",
//   "html"
// ));
// gulp.task("start", gulp.series("build", "server"));
"use strict";

var gulp = require("gulp");
var sass = require("gulp-sass");
var plumber = require("gulp-plumber");
var postcss = require("gulp-postcss");
var autoprefixer = require("autoprefixer");
var server = require("browser-sync").create();

gulp.task("css", function () {
  return gulp.src("source/sass/style.scss")
    .pipe(plumber())
    .pipe(sass())
    .pipe(postcss([
      autoprefixer()
    ]))
    .pipe(gulp.dest("source/css"))
    .pipe(server.stream());
});

gulp.task("server", function () {
  server.init({
    server: "source/",
    notify: false,
    open: true,
    cors: true,
    ui: false
  });

  gulp.watch("source/sass/**/*.{scss,sass}", gulp.series("css"));
  gulp.watch("source/*.html").on("change", server.reload);
});

gulp.task("start", gulp.series("css", "server"));