3

@1x と @2x の画像など、 gulp-image-resizeで複数の画像を吐き出すことは可能ですか。私のgulpタスクは現在次のようになっています:

gulp.task('images', function() {
  return gulp.src('test.jpg')
    .pipe(imageResize({ width: 1920 }))
    .pipe(imagemin({
      progressive: true
    }))
    .pipe(rename({
      suffix: '@2x'
    }))
    .pipe(gulp.dest('./_site/public/img'))
    .pipe(imageResize({ width: 960 }))
    .pipe(imagemin({
      progressive: true
    }))
    .pipe(gulp.dest('./_site/public/img'))
});

しかしtest@2x.jpg、960px の幅で呼び出された画像を目的のディレクトリに配置するだけです。

2 つの画像を保存する方法はありますか。test.jpg960px の幅で呼び出されたものと、1920pxtest@2x.jpgの幅で呼び出されたもの?

どんな助けでも大歓迎です。前もって感謝します!

4

1 に答える 1

1

ファイルの名前を変更するのが早すぎます。最初の gulp.dest の後に名前変更パイプを配置してください。

gulp.task('images', function() {
  return gulp.src('test.jpg')
    .pipe(imageResize({ width: 1920 }))
    .pipe(imagemin({
      progressive: true
    }))
    .pipe(gulp.dest('./_site/public/img')) // move this line to before the gulp.dest
    .pipe(rename({
      suffix: '@2x'
    }))
    .pipe(imageResize({ width: 960 }))
    .pipe(imagemin({
      progressive: true
    }))
    .pipe(gulp.dest('./_site/public/img'))
});
于 2015-06-30T16:16:20.967 に答える