Question

我想在gulp工作流程中添加一个png优化器。我已经尝试过gulp-tinypng和gulp-imagemin。

我正在使用gulp 4.0.0
这是我的功能：

function tinypng() {
  return (
    gulp
      .src(pkg.paths.src.img + '**/*.png')
      .pipe($.cache($.tinypng('MyApiKey')))      
      .pipe(gulp.dest(pkg.paths.prod.img))              // Envoie le fichier dans le dossier de production
      .pipe($.browserSync.stream())                     // Relance le browser
      .pipe($.notify({ message: 'Png task complete' })) 
  );
}

function images() {
  return (
    gulp
      .src(pkg.paths.src.img + '**/*.*')
      .pipe($.cache($.imagemin([ 
        $.imagemin.gifsicle({interlaced: true}),
        $.imagemin.jpegtran({progressive: true}),
        $.imagemin.optipng({optimizationLevel: 7}) 
        ])))                                                // cache et optimise les images
      .pipe(gulp.dest(pkg.paths.prod.img))                  // Envoie le fichier dans le dossier de production
      .pipe($.browserSync.stream())                         // Relance le browser
      .pipe($.notify({ message: 'Images task complete' })) 
  );
}

gulp.task('tinypng', tinypng);
gulp.task('images', images);

我用png权重 1002 Ko 进行测试。

如果我使用网站tinypng，则权重降低到 279 Ko

这两个功能运行平稳，没有错误，文件已复制到应有的位置， 但文件的重量并未减少 。就像在复制原始文件。

很高兴在这里获得一些帮助，因为我不知道发生了什么。

gulp-tinypng和gulp-imagemin都不优化png

0 个答案: