Question

E.g。如果我保存并运行gulp body{}，我将使用我的style.min.css body{} body{}。任何的想法？谢谢。请随时就如何改进我的gulpfile.js提供建议。

var gulp = require('gulp'),                 // npm install gulp --save-dev
    sass = require('gulp-sass'),            // npm install gulp-sass --save-dev                 
    watch = require('gulp-watch'),          // npm install gulp-watch --save-dev
    minify = require('gulp-clean-css'),     // npm install gulp-cleancss --save-dev
    rename = require('gulp-rename'),        // npm install gulp-rename --save-dev
    concat = require('gulp-concat');        // npm install gulp-concat --save-dev

// Watch
gulp.task('default', function () {
    gulp.watch('./sass/*.scss');
});

// SASS into CSS
gulp.task('styles', function () {
    gulp.src('./sass/*.scss')
        .pipe(sass())
        .pipe(concat('./style.scss'))
        .pipe(gulp.dest('./sass/'))
});

// Minify
gulp.task('minify-css', function () {
    gulp.src('./sass/style.scss')
        .pipe(minify())
        .pipe(rename('style.min.css'))
        .pipe(gulp.dest('./css/'))
});

gulp.task('default', ['styles', 'minify-css']);

修改

将它们连在一起。

// SASS into CSS
gulp.task('styles', function () {
    return gulp.src('./sass/*.scss')
        .pipe(sass())                       
        .pipe(concat('./style.css'))        
        .pipe(minify())                     
        .pipe(rename('style.min.css'))     
        .pipe(gulp.dest('./css/'))
});

Answer 1

你必须自己连接它。你有这个：

// SASS into CSS
gulp.task('styles', function () {
    gulp.src('./sass/*.scss')
        .pipe(sass())
        .pipe(concat('./style.scss'))
        .pipe(gulp.dest('./sass/'))
});

即使sass（）将其转换为.css文件，您也可以使用.scss扩展名。然后下次你运行＆＃39; styles＆＃39;这包含在流中的任何其他内容中。你不想要那个。将concat管道更改为：

.pipe(concat('./style.css'))

和＆＃39; minify-css＆＃39;的第一行任务

gulp.src('./sass/style.css')

你应该没事。

Gulp每次保存并运行gulp时都会不断添加css而不是创建新的.css文件

1 个答案: