结合一饮而尽，sourcemaps与一饮而尽，CSSO和大口喝，青菜

Question

我试图让我的gulpfile.js的这部分工作：

gulp.task('compileSass', function() { 
    return gulp.src(folders.src+'/scss/*scss') 
    .pipe(sass()) 
    .pipe(gulp.dest(folders.dest+'/css')); 
}); 

gulp.task('minifyStyles', ['compileSass'], function() { 
    return gulp.src(folders.dest+'/css/style.css') 
    .pipe(maps.init()) 
    .pipe(minCss({ 
     sourceMap: true 
    })) 
    .pipe(maps.write('./')) 
    .pipe(rename('style.min.css')) 
    .pipe(gulp.dest(folders.dest+'/css')); 
}); 

我想开发工具，以显示.scss文件。我不确定它是否与rename()有关，或者如果我在错误的时间打电话给我的源地图，但是当我检查开发工具时，源始终是style.min.css。

Answer 1

我在sass任务中看不到初始映射。您需要调用两次，并根据docs适当设置loadMaps。试试以下...

gulp.task('compileSass', function() { 
    return gulp.src(folders.src+'/scss/*scss') 
    .pipe(maps.init()) /* `init` here */ 
    .pipe(sass()) 
    .pipe(gulp.dest(folders.dest+'/css')); 
}); 

gulp.task('minifyStyles', ['compileSass'], function() { 
    return gulp.src(folders.dest+'/css/style.css') 
    .pipe(maps.init({ 
    loadMaps: true /* `init` again, load prior from sass */ 
    })) 
    .pipe(minCss({ 
    sourceMap: true 
    })) 
    .pipe(maps.write('./')) 
    .pipe(rename('style.min.css')) 
    .pipe(gulp.dest(folders.dest+'/css')); 
});