Question

我有一个像

这样的变量

var files = {
    'foo.css': 'foo.min.css',
    'bar.css': 'bar.min.css',
};

我希望gulp为我做的是minify文件，然后是rename。

但是这些任务目前写成（对于一个文件）

gulp.task('minify', function () {
    gulp.src('foo.css')
        .pipe(minify({keepBreaks: true}))
        .pipe(concat('foo.min.css'))
        .pipe(gulp.dest('./'))
});

如何重写以使其适用于上面定义的变量files？

Answer 1

您应该能够使用Glob选择src所需的任何文件，而不是在对象中定义它们，这样可以简化您的任务。此外，如果您希望将css文件缩小为单独的文件，则不需要将它们连接起来。

var gulp = require('gulp');
var minify = require('gulp-minify-css');
var rename = require('gulp-rename');

gulp.task('minify', function () {
    gulp.src('./*.css')
        .pipe(minify({keepBreaks: true}))
        .pipe(rename({
            suffix: '.min'
        }))
        .pipe(gulp.dest('./'))
    ;
});

gulp.task('default', ['minify'], function() {

});

Answer 2

我尝试了之前的答案，但是我得到了一个永无止境的循环，因为我没有忽略已经缩小的文件。

首先使用与其他答案类似的代码：

scanner.useDelimiter("\r?\n");

注意src中的//setup minify task var cssMinifyLocation = ['css/build/*.css', '!css/build/*.min.css']; gulp.task('minify-css', function() { return gulp.src(cssMinifyLocation) .pipe(minifyCss({compatibility: 'ie8', keepBreaks:false})) .pipe(rename({ suffix: '.min' })) .pipe(gulp.dest(stylesDestination)); });（即var cssMinifyLocation）

'!css/build/*.min.css'

您必须忽略手表和任务中的缩小文件。

Answer 3

这就是我所做的

var injectOptions = {
     addSuffix: '?v=' + new Date().getTime()
};

然后

return gulp.src('*.html')
    .pipe(wiredep(options))
    .pipe(inject(injectSrc, injectOptions))
    .pipe(gulp.dest(''));

最终结果是添加了唯一时间戳

index.html中的示例

   <script src="/public/js/app.js?v=1490309718489"></script>

CSS缩小并用gulp重命名

3 个答案: