Question

有一个处理SCSS文件的任务（其中一些只是普通的CSS），最终结果不会缩小..这是我的gulpfile.js的一部分：

var gulp        = require('gulp');
var gutil       = require('gulp-util');
var sass        = require('gulp-sass');
var concatCss   = require('gulp-concat-css');
var minifyCss   = require('gulp-minify-css');

var estilos = [
    'app/scss/bootstrap.scss', /*a bunch of includes of other scss files*/
    'node_modules/select2/dist/css/select2.min.css',
    'node_modules/magnific-popup/dist/magnific-popup.css',
    'app/scss/estilos.scss',
    'app/scss/indexSlider.scss'
]

gulp.task('css', function() {
    return gulp.src(estilos)
        .pipe(sass({ style: 'compressed' }).on('error', gutil.log))
        .pipe(minifyCss())
        .pipe(concatCss('final.min.css'))
        .pipe(gulp.dest('public/css'))
});

我刚开始2天前和gulp一起开始，所以到目前为止，我的调试技巧已经非常少了......我最终文件没有被缩小，我做错了什么？

Answer 1

尝试在缩小之前移动concat：

gulp.task('css', function() {
    return gulp.src(estilos)
        .pipe(sass({ style: 'compressed' }).on('error', gutil.log))
        .pipe(concatCss('final.min.css'))
        .pipe(minifyCss())
        .pipe(gulp.dest('public/css'))
});

应该修复它。

另外我建议使用gulp-clean-css，因为gulp-minify-css已被弃用。

Answer 2

你的estilos中有一个不同的src，首先你必须将它们分别编译为css，然后合并。您可以在此示例中找到答案https://ypereirareis.github.io/blog/2015/10/22/gulp-merge-less-sass-css/。

希望有帮助你）

gulp sass没有缩小

2 个答案: