@Yurik7k

Как правильно настроить gulp watch?

Вот содержимое файла main.less:

@import "../blocks/simple.less";

@import "../blocks/header.less";
@import "../blocks/slider.less";
@import "../blocks/sets.less";
@import "../blocks/help.less";
@import "../blocks/category.less";
@import "../blocks/tour.less";
@import "../blocks/recall.less";
@import "../blocks/review.less";
@import "../blocks/footer.less";

@import "../blocks/device.less";


Вот таски:
gulp.task(init.name+':less', function () {

        return gulp.src(init.less)
            .pipe(less())
            .pipe(autoprefixer())
            .pipe(cssmin())
            .pipe(gulp.dest(init.css.assets))
    });

  gulp.task(init.name+':watch', function(){

        watch(init.watch.less[0], function(event, cb) {
            gulp.start([init.name+':less']);
        });

    });


1. запускаю команду watch, она следит за изменением файлов, main.less
и файлов в нем (написал в самом начале)

2. изменяю less и сохраняю

3. изменения видны на сайте (watch отработал успешно)

4. пытаюсь еще раз изменить less

5. изменения не применяют, less не компилируются, хотя watch команду выполняет, почему так? другим словами у меня watch одноразовый
  • Вопрос задан
  • 3352 просмотра
Пригласить эксперта
Ответы на вопрос 2
UnluckySerivelha
@UnluckySerivelha
Я вот так использую. Не знаю насчёт правильности, но всё работает.
gulp.task("serve", function () {
    browserSync.init({
        server: "dev"
    });

    gulp.watch("src/scss/*.scss", ["dev:scss"]);
    gulp.watch("src/**/*.html", ["dev:html"]);
    gulp.watch("src/js/*.js", ["dev:js"]);
    gulp.watch("src/js/libs/*.js", ["dev:js-libs"]);
    gulp.watch("dev/*.html").on("change", browserSync.reload);
    gulp.watch("dev/js/*.js").on("change", browserSync.reload);
    gulp.watch("dev/**/*.css").on("change", browserSync.reload);
});
Ответ написан
@adametsderschopfer
Конкретно проблема состоит в том, что файлы, которые подключаются через @import, кэшируются особенным образом — очистка кэша (или отключение кэширования в браузере) никак не решает проблему.
Как оказалось, хранится все это в window.localStorage. В LESS уже в принципе все предусмотрели, и для того чтобы отключить кэширование достаточно установить окружение как development, а делается это следующим образом:

var less=less||{}; less.env='development';

Хочу отметить, что этот код должен располагаться до подключения less.js
Ответ написан
Комментировать
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы