Пользуюсь вот таким таском для сжатия и оптимизации изображения
Используются плагины
https://www.npmjs.com/package/gulp-image-resize
https://www.npmjs.com/package/gulp-imagemingulp.src('src/img/*.{jpg,png}')
.pipe(imageResize({
width: 240,
height: 160,
crop: true,
upscale: false
}))
.pipe(cache(imagemin({
interlaced: true,
progressive: true,
svgoPlugins: [{
removeViewBox: false
}],
use: [pngquant()]
})))
.pipe(rename({
suffix: '-240x160'
}))
.pipe(gulp.dest('app/img/collection'));
Но он на выходе всем изображениям делает стандарт 72 пикс/дюйм для заданных размеров (даже если исходник с большим разрешением).
Каким способом можно на выходе сделать 240 пикс/дюйм, например ?
Что-то в документации не нахожу.
РЕШЕНИЕ
Плагин gulp-gm решает проблему с разрешением dpi и не меняете ее при изменении размера и обрезке.
Заменил на это.
gm = require('gulp-gm')
.pipe(gm(function(gmfile, done) {
gmfile.size(function(err, size) {
var w = 150;
var h = 100;
done(null, gmfile
.density(240, 240)
.resize(w, h, '^')
.gravity('Center')
.crop(w, h, 0, 0)
);
});
}))
Однако проблему качества на ретине это не решило, поэтому все равно пришлось увеличивать изображения в 2 раза для четкости.
Простой
