Gulp加速SASS编译

Question

我正在使用Gulp进行livereload来编译我的sass.由于我每次进行更改时都将Compass添加到我的构建中,因此sass任务最多需要5秒才能完成.

我已经阅读过各种缓存插件,例如gulp-cached但我无法让它工作.当我添加gulp-cached时,compliation时间下降到大约20ms,它只处理已更改的sass部分,但sass任务的其余部分不会运行.

这是我的SASS任务

gulp.task('styles', function () {
    return gulp.src( paths.scss )
        .pipe( cache( 'sass' ) )
        .pipe( scss( options.scss ).on( 'error', gutil.log ) )
        .pipe( autoprefix( options.autoprefix ) )
        .pipe( gulp.dest( dests.css ) )
        .pipe( livereload() )
        .pipe( notify( { message: 'CSS task complete.' } ) );
});

我的完整gulpfile可以在这里找到:http://hastebin.com/oxuxegayoj.coffee

缓存插件是否应该与sass编译一起使用,或者它应该如何工作？

Answer 1

你在gulp中使用缓存的原因是不必要地处理文件.如果您有一个获取图像文件夹并对其进行转换或压缩的任务,则无论何时更改图像都不希望所有图像都运行.缓存插件通过仅提供已更改的文件来确保这一点.

这不适用于Sass或任何其他将多个文件连接成一个文件的内容,因为它只会忽略编译结果中未更改的文件.

Sass确实拥有它自己的缓存,所以即使它有效,使用gulp缓存的优势也是值得怀疑的.