Для отключения конвертации изображений в base64 в Gulp.js, вам потребуется использовать плагин gulp-imagemin и соответствующие его настройки.
Шаги для решения этой задачи следующие:
1. Установите gulp-imagemin, выполнив команду npm install gulp-imagemin --save-dev
.
2. В вашем файле Gulpfile.js импортируйте необходимые модули:
const gulp = require('gulp'); const imagemin = require('gulp-imagemin');
3. Настройте задачу для оптимизации изображений с использованием gulp-imagemin. В этом задании вам понадобятся два режима: разработка и продакшн.
a. Для разработки, когда вы не хотите конвертировать изображения в base64, вам потребуется следующий код:
gulp.task('images:dev', function() { return gulp.src('src/images/**/*') .pipe(imagemin()) .pipe(gulp.dest('dist/images')); });
b. Для продакшн-режима, в котором вы хотите выполнить конвертацию изображений в base64, вам потребуется добавить соответствующую настройку плагина gulp-imagemin:
gulp.task('images:prod', function() { return gulp.src('src/images/**/*') .pipe(imagemin({ svgoPlugins: [ {convertPathData: false} // это опция отключает преобразование изображений в base64 ] })) .pipe(gulp.dest('dist/images')); });
4. Добавьте эти задачи в ваш файл Gulpfile.js:
gulp.task('images', gulp.parallel('images:dev', 'images:prod'));
Теперь вам доступна задача gulp images
, которая будет оптимизировать изображения для разработки и продакшн-режимов, с отключенной или включенной конвертацией в base64 соответственно.
Убедитесь, что у вас есть изображения в вашей папке src/images, и после запуска задачи gulp images
, оптимизированные изображения будут сохранены в папке dist/images в соответствии с настройками задачи.
Надеюсь, это помогло вам разобраться с отключением конвертации изображений в base64 в Gulp.js. Если у вас остались вопросы, пожалуйста, дайте мне знать.