toDo/gulpfile.js at master · Alex326/toDo · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
const gulp = require('gulp');
const sourcemaps = require('gulp-sourcemaps');
const stylus = require('gulp-stylus');
const pug = require('gulp-pug');
const posthtml = require('gulp-posthtml');
const posthtmlBEM =  require('posthtml-bem');
const rename = require('gulp-rename');
const browserSync = require('browser-sync').create();
const gulpIf = require('gulp-if');
const notify = require('gulp-notify');
const plumber = require('gulp-plumber');
const del = require('del');
const postcss = require('gulp-postcss');
const autoprefixer = require('autoprefixer');
const cleanCSS = require('gulp-clean-css');
const browserify = require('gulp-browserify');

const isDevelopment = process.env.NODE_ENV !== 'production';

gulp.task('js', function () {
        return gulp.src('./blocks/**/*.js')
            .pipe(rename(function (path) {
                path.dirname = '';
            }))
            .pipe(gulp.dest('./public/'))
    }
)

gulp.task('views', function () {
    return gulp.src('pages/**/*.pug')
        .pipe(plumber({
            errorHandler: notify.onError(function (err) {
                return {
                    message: err.message
                };
            })
        }))
        .pipe(pug({
            pretty: isDevelopment
        }))
        .pipe(posthtml([
            posthtmlBEM({
                elemPrefix: '__',
                modPrefix: '_',
                modDlmtr: '_'
            })
        ]))
        .pipe(gulp.dest('./public'));
});

gulp.task('styles', function () {
    return gulp.src('./{blocks,pages}/**/*.styl')
        .pipe(plumber({
            errorHandler: notify.onError(function (err) {
                return {
                    message: err.message
                };
            })
        }))
        .pipe(rename(function (path) {
            path.dirname = '';
        }))
        .pipe(gulpIf(isDevelopment, sourcemaps.init()))
        .pipe(stylus({
            'import css': true
        }))
        .pipe(postcss([
            autoprefixer({
                browsers: ['> 5%', 'ff > 14']
            })
        ]))
        .pipe(gulpIf(isDevelopment, sourcemaps.write('./')))
        .pipe(gulpIf(!isDevelopment, cleanCSS()))
        .pipe(gulp.dest('./public/'));
});

gulp.task('images', function () {
    return gulp.src('./blocks/**/*.{png,jpg,gif,svg}')
        .pipe(rename(function (path) {
            path.dirname = '';
        }))
        .pipe(gulp.dest('./public/images'));
});

gulp.task('watch', function () {
    gulp.watch('./{blocks,pages}/**/*.pug', gulp.series('views'));
    gulp.watch('./{blocks,pages}/**/*.styl', gulp.series('styles'));
    gulp.watch('./{blocks,pages}/**/*.js', gulp.series('js'))
});

gulp.task('serve', function () {
    browserSync.init({
        server: './public',
        port: 8080
    });

    browserSync.watch('./**/*.html').on('change', browserSync.reload);
    browserSync.watch('./**/*.css').on('change', browserSync.reload);
});

gulp.task('clean', function () {
    return del('./public')
});

gulp.task('build', gulp.series(
    'clean',
    gulp.parallel(
        'js',
        'images',
        'views',
        'styles'
    )));

gulp.task('default', gulp.series(
    'build',
    gulp.parallel(
        'watch',
        'serve'
    )));