Gulp: как при изменении одного файла пересобирать другой?

Question

NkDev @NkDev

Gulp: как при изменении одного файла пересобирать другой?

Есть файл article.less следующего содержания:
@imрort "config";
@imрort "header";
@imрort "body";
@imрort "footer";

При изменении, например, файла header.less мне нужно чтобы компилировался только файл articles.less, а у меня компилируются все 4 файла. По факту мне отдельные блоки css не нужны. Меня интересует только итоговый файл, который я подключу на страницу.

Кроме того, при компиляции файла header.less, гульп выдает ошибку, что не найдена переменная. Эта переменная задается в файле config.less, поэтому файл article компилируется нормально, а когда гульп отдельно начинает компилировать header он ее не находит. Выходит что я должен в каждом файте подключать config?

Как обойти эти проблемы?

Вопрос задан более трёх лет назад
173 просмотра

3 комментария

Подписаться 1 Средний 3 комментария

ChickenGrinder @ChickenGrinder

Из текста непонятно как организован процесс, приведите код из `gulpfile`.

Написано более трёх лет назад
Егор Живагин @Krasnodar_etc

gulpfile в студию!

Написано более трёх лет назад

NkDev @NkDev Автор вопроса

var gulp = require('gulp');
var less = require('gulp-less');
var minifyCSS = require('gulp-minify-css');


gulp.task('less', function() {
  return gulp.src('web/src/style/less/**/*.less')
 .pipe(less())
 .pipe(minifyCSS())
 .pipe(gulp.dest('web/src/style/css'))
})


gulp.task('watch', function(){
  gulp.watch('web/src/style/less/**/*.less', ['less']); 
})

Написано более трёх лет назад

Решения вопроса 1

Комментировать

Пригласить эксперта

Ваш ответ на вопрос

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

Войти через центр авторизации

Похожие вопросы

JavaScript

+2 ещё

Простой
Смена стилей шапки сайта при скролле к определенному блоку? Стили должны применяться при скролле до блока и отменяться за его пределами?
- 1 подписчик
- 4 часа назад
- 41 просмотр
1

ответ
HTML

+1 ещё

Простой
Как Выделить слово приходящая из базы определенным цветом?
- 1 подписчик
- 5 часов назад
- 113 просмотров
0

ответов
CSS

Простой
Почему line-clamp для обрезания строк отображает текст ниже троеточия?
- 1 подписчик
- вчера
- 51 просмотр
1

ответ
HTML

+1 ещё

Простой
Можно ли изменить цвет шрифта снаружи для тега у которого цвет прописан внутри?
- 1 подписчик
- вчера
- 59 просмотров
2

ответа
Веб-разработка

+1 ещё

Простой
Как работает спам сообщений в ютубе?
- 1 подписчик
- вчера
- 105 просмотров
2

ответа
JavaScript

+4 ещё

Средний
Как сделать правильное динамическое масштабирование ion-range в зависимости от ширины колонок линии со значениями?
- 1 подписчик
- вчера
- 49 просмотров
0

ответов
CSS

Простой
Не работает скролл на фоне блока. Как исправить?
- 1 подписчик
- вчера
- 38 просмотров
1

ответ
HTML

+1 ещё

Простой
Как поместить картинку рядом с текстом?
- 1 подписчик
- вчера
- 85 просмотров
2

ответа
CSS

Простой
Как выровнять по высоте заголовки в карточках товаров?
- 1 подписчик
- 23 апр.
- 86 просмотров
3

ответа
Веб-разработка

Простой
Как сделать чтобы при нажатии на кнопку или сылку в div блоке открывалась галерея?
- 1 подписчик
- 23 апр.
- 40 просмотров
0

ответов
Показать ещё Загружается…

JavaScript разработчик

вАйТи

от 5 000 до 25 000 ₽

Trainee - IT Support

move2usajobs.com LLC • Лос-Анджелес

от 2 000 до 4 000 $

React разработчик

Uptrade

от 150 000 до 200 000 ₽

Доработать сайт на CS-Cart (статусы товаров и цены)

25 апр. 2024, в 16:56

5000 руб./за проект

Внесение правок в мобильное приложение (Android)

25 апр. 2024, в 16:54

3000 руб./за проект

Motion дизайн для гиф

25 апр. 2024, в 16:38

12000 руб./за проект

Из текста непонятно как организован процесс, приведите код из `gulpfile`.
var gulp = require('gulp'); var less = require('gulp-less'); var minifyCSS = require('gulp-minify-css'); gulp.task('less', function() { return gulp.src('web/src/style/less/**/*.less') .pipe(less()) .pipe(minifyCSS()) .pipe(gulp.dest('web/src/style/css')) }) gulp.task('watch', function(){ gulp.watch('web/src/style/less/**/*.less', ['less']); })

Answer 1 · 2018-06-09 15:21:28

Разбейте на подзадачи:

gulp.task('watch:article', function(){
  gulp.watch('web/src/style/less/article/**/*.less', ['less:article']); 
});
gulp.task('watch:less', ['watch:article', 'watch:other']);
gulp.task('watch', ['watch:less', 'watch:js']);

Gulp: как при изменении одного файла пересобирать другой?

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

Минуточку внимания

Войдите на сайт