Нужна помощь в оптимизации моей задачи Gulp для компиляции S CSS - PullRequest
Новая
       109

Нужна помощь в оптимизации моей задачи Gulp для компиляции S CSS

0 голосов
/ 17 марта 2020

Я настроил эту задачу Gulp для моего локального проекта. Он отлично смотрит мои папки, компилируя файлы S CSS в CSS. Единственная проблема заключается в том, что -

В среднем моя задача Gulp выполняет задачу sass примерно 6 раз в секунду, независимо от того, внесу я какие-либо изменения в код или нет. Он продолжает работать так же избыточно даже после закрытия IDE (SublimeText). Я чувствую, что это не может быть хорошей практикой, а также ставит под угрозу производительность моей машины.

screenshot of terminal

Вот мой код Gulp: 

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

gulp.task('sass', function(){
   return gulp.src('compile/style.scss')
      .pipe(sourcemaps.init({loadMaps: true}))
      .pipe(sass())
      .pipe(sass({outputStyle: 'expanded',sourceComments: false}))
      .pipe(sourcemaps.write('../../../compile'))
      .pipe(gulp.dest('public/assets/css'));
});

gulp.task('watch', function(){
    gulp.watch('compile/**/*', gulp.series('sass'));
});

gulp.task('default', gulp.series('sass','watch'));

1 Ответ

2 голосов
/ 17 марта 2020

Вы создаете al oop из-за этих двух строк: 

 .pipe(sourcemaps.write('../../../compile'))    // saving to compile


gulp.task('watch', function(){
    gulp.watch('compile/**/*', gulp.series('sass'));  // watching compile
});

Итак, ваша задача sass запускается, записывает в папку compile, которую видит watch, измененную и запускает sass задание снова, снова и снова.

Сохраняйте исходные карты в тех местах, которые не входят в ваши watch папки. 

gulp.task('sass', function(){
   return gulp.src('compile/style.scss')
      .pipe(sourcemaps.init({loadMaps: true}))
      .pipe(sass())                           // delete this, no need for two sass pipes
      .pipe(sass({outputStyle: 'expanded',sourceComments: false}))
      .pipe(sourcemaps.write('../../../compile'))
      .pipe(gulp.dest('public/assets/css'));
});
...