Gulp 4 смотреть все файлы sass, собрать один - PullRequest
Новая
       35

Gulp 4 смотреть все файлы sass, собрать один

0 голосов
/ 27 июня 2019

Моя файловая структура: 

sass
-main.sass
-variables.sass
-containers.sass
-buttons.sass
-helpers.sass

css
-main.css

В моем файле main.sass я импортирую все остальные файлы sass: 

@import "variables";
@import "containers"; 
@import "buttons"; 

//etc...

В gulp я хочу посмотреть любойизменил файл scss и скомпилировал только main.sass в main.css.

Вот что у меня есть: 

var gulp = require('gulp');
var sass = require('gulp-sass');

function styles() {
  return gulp.src('sass/main.sass', {
    sourcemaps: true
  })
  .pipe(sass().on('error', sass.logError))
  .pipe(gulp.dest('css/'));
}

function watch() {
  gulp.watch('sass/**/*.sass', styles);
}

var build = gulp.parallel(styles, watch);

gulp.task(build);
gulp.task('default', build);

Файлы просматриваются, но когда я обновляю один, main.cssфайл не обновлен.

1 Ответ

0 голосов
/ 29 июня 2019

Я полагаю, что одной из ваших проблем может быть то, что вы определяете задачу наблюдения через gulp.watch(...), но ее ссылка теряется и поэтому она никогда не вызывается.Однако я не совсем понимаю, чего вы пытаетесь достичь с помощью звонка на parallel().В настоящее время я работаю над аналогичным сценарием использования со сценарием сборки, подобным следующему: 

var gulp = require('gulp');

function styles() {
    return gulp.src('...')
        .pipe(...)
        .pipe(gulp.dest('...'));
}

exports.build = gulp.watch('...', styles);

Это должен быть минимальный рабочий пример, просто вызовите gulp build.

...