Всем доброго времени суток!
Почему-то таск 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'));