如何通过gulp-sass插件提高Gulp任务性能？

Question

我有一个长循环的sass文件（生成大约800行CSS），编译大约25秒。它太长了。

如何最小化编译时间？

谢谢！

Answer 1

这就是我如何使用gulp-sass来编译Sass，它需要大约800ms或更少的时间。你确定你使用节点版本，而不是Ruby gulp-ruby-sass？ Ruby比Node.js慢得多。

循环可能是问题，请确保您使用的是Each或For，永远不会。但我也生成了大于200个选择器的大型网格系统，而且速度也很快。尝试我的任务配置如下：

var sass = require('gulp-sass'); 
var sourcemaps = require('gulp-sourcemaps'); 
var autoprefixer = require('gulp-autoprefixer'); 
var gulpif = require('gulp-if'); 
var minify = require('gulp-minify-css'); 
var argv = require('yargs').argv; 
var cache = require('gulp-cached'); 

// Values from console flags. 
var is = { 
    dev: argv.develop, 
    prod: argv.production 
}; 

// Gulpfile config. 
var config = { 
    sass: { 
     src: './src/**/*.scss', 
     dest: 'src/', 
     maps: '/' 
    } 
}; 


gulp.task('sass', function() { 
    return gulp.src(config.sass.src) 
     .pipe(cache('sass')) 
     .pipe(gulpif(is.dev, sourcemaps.init())) 
     .pipe(autoprefixer()) 
     .pipe(gulpif(is.prod, minify())) 
     .pipe(gulpif(is.dev, sourcemaps.write(config.sass.maps))) 
     .pipe(gulp.dest(config.sass.dest)); 
});