Почему плагин gulp-imagemin не сжимает картинки, а наоборот увеличивает их объем?

Question

[user_tm]

установил плагин gulp-imagemin (версия 7.1.0) и при запуске gulp все срабатывает как надо, консоль ошибок не выдает, но в конечной паке dist, в которой появляется папка img должны быть сжатые картинки, но в том то и проблема что картинки не сжимаются, а наоборот увеличиваются и не отображаются. Вот что выдает VSCode если если нажать на картинку в проводнике и если нажать на синюю ссылку "Открыть файл, используя... ?" то выдает следующее
вот мой gukpfile.js

const gulp = require('gulp');
const sass = require('gulp-sass')(require('sass'));
const babel = require('gulp-babel');
const uglify = require('gulp-uglify');
const concat = require('gulp-concat');
const sourcemaps = require('gulp-sourcemaps');
const autoprefixer = require('gulp-autoprefixer');
const imagemin = require('gulp-imagemin');
const del = require('del');



/* пути */
const paths = {
	styles: {
		src: 'src/styles/**/*.sass',
		dest: 'dist/css/'
	},
	scripts: {
		src: 'src/scripts/**/*.js',
		dest: 'dist/js/'
	},
	images: {
		src: 'src/img/**/*',
		dest: 'dist/images'
	}
}


//задача отчистки папки dist
function clean() {
	return del(['dist'])
}

// компиляция стилей 
function styles() {
	return gulp.src(paths.styles.src)
		.pipe(sourcemaps.init())
		.pipe(sass())
		.pipe(autoprefixer({
			cascade: false
		}))
		.pipe(sourcemaps.write('.'))
		.pipe(gulp.dest(paths.styles.dest))

}

// работа с js
function scripts() {
	return gulp.src(paths.scripts.src)
		.pipe(sourcemaps.init())
		.pipe(babel({
			presets: ['@babel/env']
		}))
		.pipe(uglify())
		.pipe(concat('main.min.js'))
		.pipe(sourcemaps.write('.'))
		.pipe(gulp.dest(paths.scripts.dest))

}


function img() {
	return gulp.src(paths.images.src)
		.pipe(imagemin())
		.pipe(gulp.dest(paths.images.dest));
}




// функция, которая следит за действиями и после влючает функцию компиляция стилей
function watch() {
	gulp.watch(paths.styles.src, styles)
	gulp.watch(paths.scripts.src, scripts)
}

// константа позволяющая выполнять функции последовательно
const build = gulp.series(clean, gulp.parallel(styles, scripts, img), watch)

// экспортируемые функции 
exports.clean = clean
exports.img = img
exports.styles = styles
exports.scscripts = scripts
exports.watch = watch
exports.build = build
exports.default = build

https://github.com/reznap/gulp-imagemin.git вроде правильно запушил

версии gulp
CLI version: 3.0.0
Local version: 5.0.0

$ node -v
v18.17.0

$ npm -v
9.6.7

Comments

[user_tm]

А по-вашему, что должен выдавать "блокнот", когда вы захотите открыть в нем картинки?

выдавать саму картинку, как выдается по следующему пути src/img

Отображаться они должны в браузере, а не в текстовом редакторе.

как я уже указал выше в src/img текстовый редактор отображает исходные картинки. А вот уже в dist/images там где по сути картинки должны быть сжатыми, не отображаются, даже если зайти через проводник windows в проект и попробовать открыть. Gulp или сам плагин как будто ломает картинки.

Так происходит с любыми картинками?

да, пробовал форматы .jpg и .png

Answer 1

[Александр Викторович]

Проблема не в плагине!

https://gulpjs.com/docs/en/api/src#options

function img() {
    return gulp.src(paths.images.src, {
        encoding: false
    })
    .pipe(imagemin())
    .pipe(gulp.dest(paths.images.dest));
}

Comments

[user_tm]

Да воздаст Аллах Вам благом!!!