Add builder

gulpfile.js

+'use strict';
+
+const gulp = require('gulp'),
+    browserSync = require('browser-sync'),
+    prefixer = require('gulp-autoprefixer'),
+    rigger = require('gulp-rigger'),
+    sass = require('gulp-sass'),
+    del = require('del'),
+    concat = require('gulp-concat'),
+    minify = require('gulp-minify'),
+    spritesmith = require('gulp.spritesmith'),
+    sourcemaps = require('gulp-sourcemaps'),
+    svgSprite = require('gulp-svg-sprite'),
+    svgmin = require('gulp-svgmin'),
+    cheerio = require('gulp-cheerio'),
+    replace = require('gulp-replace'),
+    reload = browserSync.reload;
+
+gulp.task('browser-sync', function() {
+    browserSync.init({
+        server: {
+            baseDir: "./build"
+        }
+    });
+});
+
+gulp.task('fonts:build', function () {
+   return gulp.src('./src/fonts/**/*.*')
+       .pipe(gulp.dest('./build/fonts/'));
+});
+
+gulp.task('sprite:png', function() {
+    var spriteData =
+        gulp.src('./src/img/sprite/png/*.*')
+            .pipe(spritesmith({
+                imgName: 'sprite-rast.png',
+                cssName: 'sprite-rast.css',
+            }));
+
+    spriteData.img.pipe(gulp.dest('./build/img/'));
+    spriteData.css.pipe(gulp.dest('./build/css/'));
+    return spriteData;
+});
+
+
+gulp.task('sass', function () {
+    return gulp.src('./src/scss/**/*.scss')
+        .pipe(sourcemaps.init())
+        .pipe(prefixer({
+            browsers: ['last 3 version', '> 1%', 'ie 8', 'ie 9', 'Opera 12.1','Firefox >= 2'],
+            cascade: false
+        }))
+        .pipe(sass().on('error', sass.logError))
+        .pipe(sourcemaps.write())
+        .pipe(gulp.dest('./build/css'));
+});
+
+gulp.task('concat_js', function() {
+    return gulp.src(['./src/js/**/*.js'])
+        .pipe(sourcemaps.init())
+        .pipe(concat('all.js'))
+        .pipe(minify({
+            ext:{
+                src:'',
+                min:'.min.js'
+            },
+            noSource: false}))
+        .pipe(sourcemaps.write())
+        .pipe(gulp.dest('./build/js'));
+});
+
+gulp.task('html:build', function () {
+    return gulp.src('./src/*.html')
+        .pipe(rigger())
+        .pipe(gulp.dest('./build'))
+        .pipe(reload({stream: true}));
+});
+
+gulp.task('sprite:svg', function () {
+   return gulp.src('./src/img/sprite/svg/*.svg')
+       .pipe(svgmin({
+           js2svg: {
+               pretty: true
+           }
+       }))
+       .pipe(cheerio({
+           run: function ($) {
+               $('[fill]').removeAttr('fill');
+               $('[stroke]').removeAttr('stroke');
+               $('[style]').removeAttr('style');
+           },
+           parserOptions: {xmlMode: true}
+       }))
+       .pipe(replace('>', '>'))
+       .pipe(svgSprite({
+           mode: {
+               symbol: {
+                   sprite: "../sprite-vector.svg",
+               }
+           }
+       }))
+       .pipe(gulp.dest('./build/img'));
+});
+
+
+gulp.task('watch', function() {
+    gulp.watch('./src/scss/**/*.scss', gulp.series('sass'));
+    gulp.watch('./src/js/**/*.js', gulp.series('concat_js'));
+    gulp.watch('./src/img/sprite/png/*.*', gulp.series('sprite:png'));
+    gulp.watch('./src/**/*.html', gulp.series('html:build'));
+    gulp.watch('./src/img/sprite/svg/*.*', gulp.series('sprite:svg'));
+    gulp.watch('./src/fonts/**/*.*', gulp.series('fonts:build'));
+});
+
+
+
+gulp.task('clean', function() {
+    return del(['build']);
+});
+
+gulp.task('default', gulp.series(
+    'clean',
+    gulp.parallel(
+        'sass',
+        'html:build',
+        'concat_js',
+        'sprite:png',
+        'sprite:svg',
+        'fonts:build'
+    ),
+    gulp.parallel(
+        'watch',
+        'browser-sync'
+    )
+));
\ No newline at end of file

package.json

+{
+  "name": "device-md",
+  "version": "1.0.0",
+  "description": "",
+  "main": "index.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "keywords": [],
+  "author": "",
+  "license": "ISC",
+  "devDependencies": {
+    "browser-sync": "^2.24.7",
+    "del": "^3.0.0",
+    "gulp": "^4.0.0",
+    "gulp-autoprefixer": "^6.0.0",
+    "gulp-cheerio": "^0.6.3",
+    "gulp-concat": "^2.6.1",
+    "gulp-minify": "^3.1.0",
+    "gulp-replace": "^1.0.0",
+    "gulp-rigger": "^0.5.8",
+    "gulp-sass": "^4.0.1",
+    "gulp-sourcemaps": "^2.6.4",
+    "gulp-svg-sprite": "^1.4.0",
+    "gulp-svgmin": "^2.0.0",
+    "gulp.spritesmith": "^6.9.0"
+  }
+}

src/index.html

+<!DOCTYPE html>
+<html>
+<head lang="ru">
+    <meta charset="UTF-8">
+    <title>Регистрация в чате</title>
+    <link rel="stylesheet" href="css/utils.css">
+</head>
+<body>
+
+
+<section class="content">
+    <svg class="inline-svg-icon">
+        <use xlink:href="img/sprite-vector.svg#sex"></use>
+    </svg>
+</section>
+
+</body>
+<script src="js/all.js"></script>
+</html>
\ No newline at end of file

src/info.txt

+rigger()
+//= template/footer.html
\ No newline at end of file