browserSync работает нормально, но sass не перезагружается, и я не вижу, как мои изменения автоматически перезагружаются в браузере.
По сути, он не перезагружается, когда я повторно запускаю gulp start в терминале. Я использую Gulp 4, вот мой index.js.
Помоги мне ?
Спасибо!
gulp.task('style', () => {
console.log('execute sass file');
return gulp.src('src/assets/scss/styles.scss')
.pipe(rename('css/styles.css'))
.pipe(gulp.dest('dist/css'));
});
gulp.task('index', () => {
console.log('execute twig');
return gulp.src('src/markup/index.twig')
.pipe(rename('html/index.html'))
.pipe(gulp.dest('dist/html'))
});
gulp.task('twig', function() {
return gulp.src('src/markup/*.twig')
.pipe(twig())
.pipe(gulp.dest('dist/html'))
.pipe(browserSync.reload({
stream: true
}))
});
gulp.task('sass', function () {
return gulp.src('src/assets/scss/*.scss')
.pipe(sass())
.pipe(gulp.dest('dist/css'))
.pipe(browserSync.reload({
stream: true
}))
});
gulp.task('watch', function() {
gulp.watch('src/assets/scss/**/*.scss', gulp.task('style'));
gulp.watch('src/markup/index.twig', gulp.task('twig'));
console.log('task twig and sass works');
gulp.watch('src/markup/*.twig', browserSync.reload);
gulp.watch('src/assets/scss/*.scss', browserSync.reload);
});
gulp.task('browser-sync', () => {
browserSync.init({
server: {
baseDir: 'dist/html/',
browser:"google chrome",
open: true,
}
});
});
gulp.task('start', gulp.parallel('browser-sync','twig', 'sass', 'watch'));