Как в gulp следить за импортируемыми файлами и перекомпилировать главные?

Question

[gleendo]

Разбираюсь с gulp, нужно просто чтобы происходила слежка и компиляция файлов stylus и jade.
Погуглил, получился вот такой файл gulp и вот такая вот структура: Ссылка на скрин

Теперь оно нормально работает только если изменения вносить в главные файлы.
Но в них же есть импорты. И я думал, что при изменении файла который импортируется, произойдут изменения и в главном файле и оно перекомпилируется, но это не так как оказалось.

В общем, как сделать, чтобы при изменении любого файла происходила перекомпиляция?

Например, я изменил значение переменной в файле vars.styl и изменения отобразились на странице. Чтобы gulp знал, что я изменил импортируемый файл и перекомпилировал главный, в котором все импорты.

Answer 1

[Алексей Ярков]

gulp.src([
            "path/to/stylus/**/*.styl",
            "!path/to/stylus/**/_*.styl"
        ])

Comments

[abberati]

не совсем верно. так таск будет обрабатывать каждый файл. а надо _следить_ за всеми файлами, а _обрабатывать_ только главный.

[Алексей Ярков]

abberati: я не знаю как там в ваших stylus, а у меня в jade не компилируются в html файлы все, которые с символа "_" начинаются. Вот я имею _head.jade и index.jade. В index.jade пишем include _head.jade. Теперь изменив _head.jade таск скомпилирует только index.jade, а _head.jade включит в него.

Answer 2

[Константин Величко]

Посмотрите мой шаблон там это реализовано в том числе и для jade https://github.com/zoxon/gulp-front

Answer 3

[ROBsoer]

Вам нужно, чтобы вотчер следил за всеми файлами определенного типа, а на вход обработчиков только главные.
Вот так примерно будет выглядеть ваш watch-таск:

gulp.task("watch", function () {
  gulp.watch("application/jade/**/*.jade", ["jade"]);
  gulp.watch("application/stylus/**/*.styl", ["stylus"]);
}