我正在尝试使用 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);
});
我是否遗漏了配置中的某些内容?
最佳答案
我假设您有理由期待比您得到的更显着的尺寸减小。在那种情况下,我敢打赌问题出在旧技术上。
您正在使用的 gulp-image-optimization
似乎依赖于旧的 imagemin
,它没有将每种类型的优化分解为它自己的插件(我说“出现”是因为它已经有好几年了,这就是 gulp-image-optimization
文档中反射(reflect)的内容,如果我没记错的话,这就是 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 优化图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42255739/