29

私は次のような変数を持っています

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

私がgulpに私のためにしてもらいたいことはminify、ファイルに対して、そしてrename私に対してです。

ただし、タスクは現在（1つのファイルに対して）次のように記述されています

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

上記で定義した変数で動作するように書き換える方法はfiles?

4

3 に答える 3

63

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() {

});
于 2014-09-10T16:58:57.720 に答える
15

以前の回答を試しましたが、既に縮小されたファイルを無視していなかったため、終わりのないループが発生しました。

最初に、他の回答と同様のこのコードを使用します。

//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));
});

src に注目してください'!css/build/*.min.css'(つまり、var cssMinifyLocation)

//Watch task
gulp.task('default',function() {
    gulp.watch(stylesLocation,['styles']);
    gulp.watch(cssMinifyLocation,['minify-css']);
});

ウォッチとタスクの両方で縮小されたファイルを無視する必要があります。

于 2015-10-22T23:01:36.620 に答える
2

これは私がやったことです

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>
于 2017-03-23T22:59:39.587 に答える