gulp-image-resize с несколькими изображениями

Можно ли сделать так, чтобы gulp-image-resize выплевывал несколько изображений, например изображение @1x и @2x. Моя задница глотка выглядит сейчас так:

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 с шириной 960 пикселей в мой каталог назначения.

Есть ли способ сохранить два изображения. Один называется test.jpg с шириной 960px, и один называется test@2x.jpg с шириной 1920px?

Любая помощь приветствуется. Заранее спасибо!

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'))
});
Другие вопросы по тегам