javascript - Gulp 4.0: gulp-remember または gulp-cache が sass の適切なコンパイルを妨げる (インクリメンタル ビルド)

Question

昨日、プロジェクトのスタイルをコンパイルする際に速度を上げるために、Gulp を 4.0 にアップグレードしました (サイズが大きくなりました。現在、Mac Pro 2016 では 19 秒待つ必要があります)。

掘り下げた後、gulp-cached と gulp-remember をビルドに追加することにしました。

スタイルの現在の gulpfile.js は次のとおりです。

var gulp  = require('gulp'),
sass = require('gulp-sass'),
cached = require('gulp-cached'),
sourcemaps = require('gulp-sourcemaps'),
autoprefixer = require('gulp-autoprefixer'),
remember = require('gulp-remember'),
gs = gulp.series,
concat = require('gulp-concat'),
gp = gulp.parallel;

gulp.task('compile:styles', () => {
return gulp.src([

    // Grab your custom scripts
    './assets/scss/**/*.scss'

])
    .pipe(sourcemaps.init()) // Start Sourcemaps
    .pipe(cached('sass'))
    .pipe(sass())
    .pipe(autoprefixer({
        browsers: ['last 2 versions']
    }))
    .pipe(remember('sass'))
    .pipe(sourcemaps.write('.')) // Creates sourcemaps for minified styles
    .pipe(gulp.dest('./assets/css/'));
});

gulp.task('watch:styles', () => {
gulp.watch('./assets/scss/**/*.scss', gs('styles'))
    .on('change', function (event) {
        console.log("event happened:"+JSON.stringify(event));
        if (event.type === 'deleted') {
            //delete from gulp-remember cache
            remember.forget('sass', event.path);
            //delete from gulp-cached cache
            delete cache.caches['sass'][event.path];
        }
    });
 });

gulp.task('watch', gp(
'watch:styles'
));

ここでの私の問題は、ビルドが最初のコンパイルでうまく機能することです。これには約 3 秒かかります。後で変更を加えると、変更を行ったファイルを確認でき、コンパイルが開始されますが、出力ファイルには内部の変化。

gulp-cached と gulp-remeber に関しては、何も得られていないと思います。しかし、ファイルの最後に、変更が行われた後にキャッシュを消去するはずの関数が表示されます。

私のコードを見ていただけますか？たぶん、あなたはいくつかのアドバイスをするでしょう。

乾杯！

### 編集 26.08

解決策を探しているときに、次の投稿に遭遇しました。

それに応じて、次のコードを使用しました（ただし、効果は上記の例と同じです）：

// Grab our gulp packages
var gulp  = require('gulp'),
sass = require('gulp-sass'),
sourcemaps = require('gulp-sourcemaps'),
autoprefixer = require('gulp-autoprefixer'),
gs = gulp.series,
gp = gulp.parallel,
cache  = require('gulp-memory-cache');

gulp.task('compile:styles', () => {
return gulp.src('./assets/scss/**/*.scss', {since: cache.lastMtime('sass')})
    .pipe(sourcemaps.init()) // Start Sourcemaps
    .pipe(sass())
    .pipe(autoprefixer({
        browsers: ['last 2 versions']
    }))
    .pipe(cache('sass'))
    .pipe(sourcemaps.write('.')) // Creates sourcemaps for minified styles
    .pipe(gulp.dest('./assets/css/'));
});

gulp.task('watch:styles', () => {
gulp.watch('./assets/scss/**/*.scss', gs('compile:styles'))
    .on('change', cache.update('sass'));
});

gulp.task('build', gs(
'compile:styles',
'watch:styles'
));