3

我正在尝试使用 imagemin Gulp 优化我的图像

https://www.npmjs.com/package/gulp-image-optimization

我很难找到一个好的文档，它可以向我展示确切的参数和不同的选项。目前我的优化没有太多收获：

var imageop = require('gulp-image-optimization');
var pngquant = require('imagemin-pngquant');
var imageminJpegoptim = require('imagemin-jpegoptim');

var baseUrl = "web/assets/";
var imgSrc = baseUrl + "src/images/";
var imgDist = baseUrl + "dist/images/";

gulp.task('img', function(cb) {
    gulp.src([imgSrc + '**/*.png', imgSrc + '**/*.jpg', imgSrc + '**/*.gif', imgSrc + '**/*.jpeg'])
        .pipe(imageop({
            optimizationLevel: 10,
            progressive: true,
            interlaced: true,
            use: [pngquant(), imageminJpegoptim()]
        }))
        .pipe(gulp.dest(imgDist)).on('end', cb).on('error', cb);
});

我错过了配置中的某些内容吗？

4

1 回答 1

2

我假设你有理由期望比你得到的更显着的尺寸减少。在那种情况下，我敢打赌，麻烦在于旧技术。

您正在使用的gulp-image-optimization似乎依赖于 old imagemin，它没有将每种类型的优化分解成自己的插件（我说“出现”是因为它已经有多年历史了，这就是gulp-image-optimization's 文档中反映的内容，这就是imagemin过去的工作方式如果我没记错的话）。

这些天推荐的插件，以及在imagemin文档中链接的插件，是gulp-imagemin.

使用gulp-imagemin，您的基本设置将类似于

const gulp = require('gulp'),
      imagemin = require('gulp-imagemin');

gulp.task('default', (cb) =>
    gulp.src('src/images/*')
        .pipe(imagemin())
        .pipe(gulp.dest('dist/images')).on('end', cb).on('error', cb)
);

（该代码直接取自gulp-imagemin文档，并添加了错误回调。）

gulp-imagemin默认情况下包括用于 png( optipng) 和 jpg ( jpegtran) 优化的插件。

于 2017-02-18T18:59:39.837 回答