Corruption of image files during migration or optimization
When the script is triggered, the file from the app/images/brand_logo.jpg folder is copied to dist/images/brand_logo.jpg. There should be no changes to the file but it changes and becomes unreadable.
In another project, when using "gulp-tinify": "^1.0.2" the same problem.
I checked with gulp version 4.0.2 installed and everything works correctly.
Node version: 20.13.0 npm version: 10.5.2 gulp --version CLI version: 3.0.0 Local version: 5.0.0
package.json: { "name": "test", "version": "1.0.0", "main": "gulpfile.js", "private": true, "type": "module", "browserslist": [ "last 2 version", "not dead", "not ie <= 11", "iOS >= 12" ], "scripts": { "test": "echo "Error: no test specified" && exit 1" }, "author": "", "license": "ISC", "devDependencies": { "gulp": "^5.0.0", "gulp-imagemin": "^9.1.0", "gulp-newer": "^1.4.0" } }
gulpfile.js: import gulp from 'gulp'; import imagemin from 'gulp-imagemin'; import newer from 'gulp-newer';
const app = 'app', dist = 'dist';
const config = { app : { svg : app + '/images//*.svg', img : app + '/images//.{jpg,jpeg,png,gif,webp}', }, dist : { svg : dist + '/images/**/.svg', img : dist + '/images//*', all : dist + '//*', }, }
// Images
export const images = gulp.series( function(cb){ return gulp.src(config.app.svg, { base: 'app' }) .pipe(newer(config.dist.svg)) .pipe(imagemin()) .pipe(gulp.dest(dist)) cb(); }, ); export const imgtinify = () => { return gulp.src(config.app.img, { base: 'app', encoding: false, buffer: false }) .pipe(newer(config.dist.img)) .pipe(gulp.dest(dist)) };
// Watch
export const startwatch = () => { gulp.watch(config.app.img, gulp.series( imgtinify, )); gulp.watch(config.app.svg, gulp.series(images, )); };
// Default
export default gulp.series(
gulp.parallel(
images,
imgtinify,
),
gulp.parallel(
startwatch,
),
);
Source: gulpjs/gulp