Задать вопрос
@konstantinst13

Почему Gulp Watch не видит изменения в pug файлах? Просто команда gulp их видит. В чём проблема?

Всем доброго времени суток!

Почему-то таск watch не видит мои изменения в .pug файлах, когда я вношу их. При этом если остановить gulp watch и снова в консоли написать gulp, то все изменения из .pug будут перенесены в index.html. А если дальше редактировать .pug-файлы, то gulp watch их всё равно не увидит до следующего перезапуска галпа.

У меня дефолтный таск gulp запускает несколько тасков и в конце запускает таск watch.

gulpfile.js
let gulp = require('gulp'),
    pug = require('gulp-pug'),
    sass = require('gulp-sass'),
    browserSync = require('browser-sync'),
    uglify = require('gulp-uglify'),
    concat = require('gulp-concat'),
    rename = require('gulp-rename'),
    del = require('del'),
    autoprefixer = require('gulp-autoprefixer'),
    gcmq = require('gulp-group-css-media-queries');


gulp.task('clean', async function () {
    del.sync('dist')
})

gulp.task('pug',function() {
 return gulp.src('app/pug/*.pug')
 .pipe(pug({
    doctype: 'html',
    pretty: false
 }))
 .pipe(gulp.dest('app/'));
});

gulp.task('scss', function () {
    return gulp.src('app/scss/style.scss')


        .pipe(autoprefixer({
            cascade: false
        }))

        .pipe(sass({
            outputStyle: 'expanded'
        }))
      .pipe(gcmq())
        .pipe(gulp.dest('app/css'))
        .pipe(sass({
            outputStyle: 'compressed'
        }))
      .pipe(gcmq())
        .pipe(rename({
            suffix: '.min'
        }))
        .pipe(gulp.dest('app/css'))
//        .pipe(browserSync.reload({
//            stream: true
//        }))
});

gulp.task('css', function () {
    return gulp.src([
    'node_modules/normalize.css/normalize.css',
    'node_modules/slick-carousel/slick/slick.css',
  ])
        .pipe(concat('_libs.scss'))
        .pipe(gulp.dest('app/scss'))
        .pipe(gcmq())
//        .pipe(browserSync.reload({
//            stream: true
//        }))
});

gulp.task('html', function () {
    return gulp.src('app/*.html')
//        .pipe(browserSync.reload({
//            stream: true
//        }))
});

gulp.task('script', function () {
    return gulp.src('app/js/*.js')
//        .pipe(browserSync.reload({
//            stream: true
//        }))
});

gulp.task('js', function () {
    return gulp.src([
    'node_modules/slick-carousel/slick/slick.js'
  ])
        .pipe(concat('libs.min.js'))
        .pipe(uglify())
        .pipe(gulp.dest('app/js'))
//        .pipe(browserSync.reload({
//            stream: true
//        }))
});

//gulp.task('browser-sync', function () {
//    browserSync.init({
//        server: {
//            baseDir: "app/"
//        }
//    });
//});

gulp.task('export', function () {
    let buildHtml = gulp.src('app/**/*.html')
        .pipe(gulp.dest('dist'));

    let BuildCss = gulp.src('app/css/**/*.css')
        .pipe(gulp.dest('dist/css'));

    let BuildJs = gulp.src('app/js/**/*.js')
        .pipe(gulp.dest('dist/js'));

    let BuildFonts = gulp.src('app/fonts/**/*.*')
        .pipe(gulp.dest('dist/fonts'));

    let BuildImg = gulp.src('app/img/**/*.*')
        .pipe(gulp.dest('dist/img'));
});

gulp.task('watch', function () {
    gulp.watch('app/pug/*.pug', gulp.parallel('pug'));
    gulp.watch('app/scss/**/*.scss', gulp.parallel('scss'));
    gulp.watch('app/*.html', gulp.parallel('html'))
    gulp.watch('app/js/*.js', gulp.parallel('script'))
});

gulp.task('build', gulp.series('clean', 'export'))

//gulp.task('default', gulp.parallel('pug', 'scss', 'css', 'js', 'browser-sync', 'watch'));
gulp.task('default', gulp.parallel('pug', 'scss', 'css', 'js', 'watch'));
  • Вопрос задан
  • 111 просмотров
Подписаться 1 Простой 2 комментария
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы