Вот код в gulpfile.js :
gulp.task('css', function () {
gulp.src('src/less/style.less') // Выберем наш style.less
.pipe(sourcemaps.init())
.pipe(less()) // Скомпилируем
.pipe(prefixer()) // Добавим вендорные префиксы
.pipe(sourcemaps.write())
.pipe(gulp.dest('build/css/'))
.pipe(browserSync.stream());
});
gulp.task('watch', function () {
gulp.watch('src/**/*.html', ['html']);
gulp.watch('src/less/**/*.less', ['css']);
gulp.watch('src/header/header.less', ['headercss']);
gulp.watch('src/js/**/*.js', ['js']);
gulp.watch('src/fonts/**/*.*', ['fonts']);
gulp.watch('src/img/**/*.*', ['img']);
gulp.watch('src/img/icons/*.*', ['sprite']);
gulp.watch('src/fonts/**/*.*', ['fonts']);
gulp.watch('src/libs/**/*.*', ['libs']);
});
Когда меняю файл style.less в редакторе, то соответственно, и файл style.css тоже меняется.
При этом изменения сразу видны в браузере.
В логах консоли никаких ошибок не наблюдается.
Проблема в том, что как только перезагружаю браузер, то все последние изменения исчезают, просто мистика какая-то.
Проблема решается только перезагрузкой gulpa, но понятно что это только костыль. Не могу понять в чем проблема, почему браузер не видит изменения в файле стилей. Вот, как только начинаю менять style.less, то, о чудо, браузер опять начинает видеть эти изменения.
По моему что-то блокирует доступ браузеру к стиля.
Может кто-то сталкивался с такой же проблемой?