Почему не работает плагин gulp-imagemin?
Проблема заключается в том что при использование данного плагина ломается gulp, начинает выдавать в консоль непонятные символы.
const {task, src, series, dest, watch, parallel} = require('gulp'); const fileInclude = require('gulp-file-include'); const sass = require('gulp-sass')(require('sass')); const server = require('gulp-server-livereload'); const clean = require('gulp-clean'); const fs = require('fs'); const sourceMaps = require('gulp-sourcemaps'); const plumber = require('gulp-plumber'); const notify = require('gulp-notify'); const babel = require('gulp-babel'); const imagemin = require('gulp-imagemin'); const changed = require('gulp-changed'); task('html', () => { return src('./src/*.html') // return src(['./src/*.html', '!./src/*.html']) // исключает файл .pipe(changed('./dist/')) .pipe(plumber({ errorHandler: notify.onError({ title: 'HTML', message: 'Error <%= error.message %>', sound: false, }), })) .pipe(fileInclude({ prefix: '@@', basepath: '@file', })) .pipe(dest('./dist/')) }); task('css', () => { return src('./src/css/*.css') .pipe(changed('./dist/css')) .pipe(plumber({ errorHandler: notify.onError({ title: 'Styles', message: 'Error <%= error.message %>', sound: false, }), })) .pipe(sourceMaps.init()) .pipe(sass()) .pipe(sourceMaps.write()) .pipe(dest('./dist/css/')) }); task('js', () => { return src('./src/js/*.js') .pipe(changed('./dist/js')) .pipe(plumber({ errorHandler: notify.onError({ title: 'JS', message: 'Error <%= error.message %>', sound: false, }) })) // .pipe(babel()) .pipe(dest('./dist/js')) }); task('fonts', () => { return src('./src/fonts/**/*') .pipe(changed('./dist/fonts')) .pipe(dest('./dist/fonts')) }); task('images', () => { return src('./src/images/**/*') .pipe(changed('./dist/images')) .pipe(imagemin({ verbose: true })) .pipe(dest('./dist/images')) }); task('css2', () => { return src('./src/css2') .pipe(dest('./dist/')) }); task('server', () => { return src('./dist/') .pipe(server({ livereload: true, open: true, })); }); task('clean', (done) => { if (fs.existsSync('./dist/')) { return src('./dist/', { read: false }) .pipe(clean({ force: true })) } done(); }); task('watch', () => { watch('./src/**/*.html', series('html')); watch('./src/css/**/*.scss', series('css')); watch('./src/js/**/*.js', series('js')); watch('./src/fonts/**/*', series('fonts')); watch('./src/images/*', series('images')); }); task('default', series( 'clean', parallel('html', 'css', 'js', 'fonts', 'images', 'css2'), parallel('server', 'watch'), )) |
const {task, src, series, dest, watch, parallel} = require('gulp'); const fileInclude = require('gulp-file-include'); const sass = require('gulp-sass')(require('sass')); const server = require('gulp-server-livereload'); const clean = require('gulp-clean'); const fs = require('fs'); const sourceMaps = require('gulp-sourcemaps'); const plumber = require('gulp-plumber'); const notify = require('gulp-notify'); const babel = require('gulp-babel'); const imagemin = require('gulp-imagemin'); const changed = require('gulp-changed'); task('html', () => { return src('./src/*.html') // return src(['./src/*.html', '!./src/*.html']) // исключает файл .pipe(changed('./dist/')) .pipe(plumber({ errorHandler: notify.onError({ title: 'HTML', message: 'Error <%= error.message %>', sound: false, }), })) .pipe(fileInclude({ prefix: '@@', basepath: '@file', })) .pipe(dest('./dist/')) }); task('css', () => { return src('./src/css/*.css') .pipe(changed('./dist/css')) .pipe(plumber({ errorHandler: notify.onError({ title: 'Styles', message: 'Error <%= error.message %>', sound: false, }), })) .pipe(sourceMaps.init()) .pipe(sass()) .pipe(sourceMaps.write()) .pipe(dest('./dist/css/')) }); task('js', () => { return src('./src/js/*.js') .pipe(changed('./dist/js')) .pipe(plumber({ errorHandler: notify.onError({ title: 'JS', message: 'Error <%= error.message %>', sound: false, }) })) // .pipe(babel()) .pipe(dest('./dist/js')) }); task('fonts', () => { return src('./src/fonts/**/*') .pipe(changed('./dist/fonts')) .pipe(dest('./dist/fonts')) }); task('images', () => { return src('./src/images/**/*') .pipe(changed('./dist/images')) .pipe(imagemin({ verbose: true })) .pipe(dest('./dist/images')) }); task('css2', () => { return src('./src/css2') .pipe(dest('./dist/')) }); task('server', () => { return src('./dist/') .pipe(server({ livereload: true, open: true, })); }); task('clean', (done) => { if (fs.existsSync('./dist/')) { return src('./dist/', { read: false }) .pipe(clean({ force: true })) } done(); }); task('watch', () => { watch('./src/**/*.html', series('html')); watch('./src/css/**/*.scss', series('css')); watch('./src/js/**/*.js', series('js')); watch('./src/fonts/**/*', series('fonts')); watch('./src/images/*', series('images')); }); task('default', series( 'clean', parallel('html', 'css', 'js', 'fonts', 'images', 'css2'), parallel('server', 'watch'), ))
Дополнительно:
Ответы:
Откуда вы взяли такое его использование? В официальной доке нет примеров, где параметром передаётся объект, либо пустые параметры, либо массив оптимизаторов.
https://github.com/sindresorhus/gulp-imagemin
Объект с параметрами может быть передан только 2 аргументом.
Опишите проблему, и специалист поможет с настройкой, исправлением ошибки или доработкой сайта. Подберём понятный план работ без лишней переписки.
Пока нет других ответов. Будьте первым, кто поможет автору.
Ответить на вопрос
Для того чтобы понять, почему не работает плагин gulp-imagemin, необходимо провести некоторые действия для диагностики проблемы. Вот несколько шагов, которые могут помочь вам разобраться с этой проблемой:
1. Убедитесь, что у вас установлен Gulp и gulp-imagemin. Вы можете проверить их установку, запустив команды `gulp -v` и `npm ls gulp-imagemin`.
2. Проверьте, что ваш `gulpfile.js` правильно настроен. Убедитесь, что вы правильно подключили gulp и gulp-imagemin, а также указали правильные пути к изображениям.
3. Проверьте, что у вас установлены все необходимые зависимости. Возможно, что вам не хватает каких-то пакетов, необходимых для работы gulp-imagemin. Установите их с помощью npm.
4. Проверьте права доступа к папке с изображениями. Убедитесь, что у вас есть права на чтение и запись в эту папку.
5. Попробуйте запустить Gulp с флагом --verbose, чтобы получить более подробный вывод о том, что происходит во время выполнения задач.
6. Проверьте консоль на наличие ошибок. Возможно, что у вас есть какие-то ошибки, которые могут помочь вам понять, почему плагин gulp-imagemin не работает.
Если после выполнения всех этих шагов проблема остается нерешенной, попробуйте обратиться за помощью на форумах или в сообществе разработчиков. Предоставьте им как можно больше информации о вашей проблеме, чтобы они могли вам помочь более эффективно.