Как исправить ошибку при запуске gulp-imagemin?

Question

[Данила Кудрявцев]

Error [ERR_REQUIRE_ESM]: require() of ES Module D:\dla saitov\Gulp-start\node_modules\gulp-imagemin\index.js from D:\dla saitov\Gulp-start\gulpfile.js not supported.
Instead change the require of index.js in D:\dla saitov\Gulp-start\gulpfile.js to a dynamic import() which is available in all CommonJS modules.
at Object. (D:\dla saitov\Gulp-start\gulpfile.js:8:24) {
code: 'ERR_REQUIRE_ESM'

const { src, dest, watch, parallel, removeListener } = require('gulp');

const scss           = require('gulp-sass')(require('sass'));
const concat         = require('gulp-concat');
const browserSync    = require('browser-sync').create();
const uglify         = require('gulp-uglify-es').default;
const autoprefixer   = require('gulp-autoprefixer');
const imagemin       = require('gulp-imagemin');

function browsersync() {
   browserSync.init({
      server: {
         baseDir: 'app/'
      }
   });
}

function images() {
   return src('app/images/*')
      .pipe(imagemin(
         [
            imagemin.gifsicle({ interlaced: true}),
            imagemin.mozjpeg({ quality: 75, progressive: true}),
            imagemin.optipng({ optimizationLevel: 5}),
            imagemin.svgo({
                plugins: [
                  { removeViewBox: true },
                  { cleanupIDs: false }
               ]
          })
      ]))
      .pipe(dest('dist/images'))
}

function scripts() {
   return src([
      'node_modules/jquery/dist/jquery.js',
      'app/js/main.js'
   ])
   .pipe(concat('main.min.js'))
   .pipe(uglify())
   .pipe(dest('app/js'))
   .pipe(browserSync.stream())
}

function styles() {
   return src('app/scss/style.scss')
      .pipe(scss({outputStyle: 'compressed'}))
      .pipe(concat('style.min.css'))
      .pipe(autoprefixer ({
         overrideBrowserslist: ['last 10 version'],
         grid: true
      }))
      .pipe(dest('app/css'))
      .pipe(browserSync.stream())
}

function build() {
   return src([
      'app/css/style.min.css',
      'app/fonts/**/*',
      'app/js/main.min.js',
      'app/*.html',
   ], {base: 'app'})
      .pipe(dest('dist'))
}

function watching() {
   watch(['app/scss/**/*.scss'], styles);
   watch(['app/js/**/*.js' , '!app/js/main.min.js'], scripts);
   watch("app/*.html").on('change', browserSync.reload);
}

exports.styles       = styles;
exports.watching     = watching;
exports.browsersync  = browsersync;
exports.scripts      = scripts;
exports.build        = build;
exports.images       = images;


exports.default = parallel(scripts, browsersync, watching);

Answer 1

[Данила Кудрявцев]

Удалил непонятный фиг - "removeListener"
и только после того как, сменил версию del с 7.0.0 на 6.0.0 (хотя на момент появления ошибки даже не было установлено вообще)
и все заработало
-_-

Comments

[Ivan Gavrilich]

Если Вы используете Gulp 4, то в нём removeListener убран, из-за чего возникала ошибка, так как Вы импортировали несуществующую функцию.

Насчёт del, автор на версии 7.0.0 перевёл плагин на ESM, из-за чего работа на CJS с del выше версии 6.0.0 невозможна. Так что советую отказаться от устаревшего CJS, давно идёт тенденция от отказа его поддержки и перехода на ESM.

[Ivan Gavrilich]

И на будущее, прикладывайте к своему вопросу package.json