title: Getting ` Error [ERR_REQUIRE_ESM]` while running `gulp` command
body: <p>I'm new to <code>Gulp</code> and trying to automate some tasks. Here's my environment setup: <code>npm version: 8.1.0</code>, <code>node version 17.0.1</code>, <code>gulp CLI version 2.3.0</code> and <code>gulp version 4.0.2</code></p>
  <p>And here's my <code>gulpfile.js</code>:</p>
  <pre><code>// list of dependencies ( things require to run the below funcitions)
  const { src, dest, watch, series } = require('gulp');
  const sass = require('gulp-sass');
  const prefix = require('gulp-autoprefixer');
  const minify = require('gulp-clean-css');
  const terser = require('gulp-terser');
  const imagemin = require('gulp-imagemin');
  const imagewebp = require('gulp-webp');
  
  
  
  // create functions
  
  
  // SCSS
  function compilescss() {
      return src('src/scss/*.scss')
          .pipe(sass())
          .pipe(prefix('last 2 versions'))
          .pipe(minify())
          .pipe(dest('/dist/css'))
  }
  
  
  // JS
  function jsmin(){
      return src('src/js/*.js')
          .pipe(terser())
          .pipe(dest('dist/js'))
  }
  
  // images
  function optimizeimg() {
      return src('src/img/*.{jpg,png}')
          .pipe(imagemin([
              imagemin.mozjpeg({quality: 80, progressive: true}),
              imagemin.optipng({optiminzationLevel: 2})
          ]))
          .pipe(dest('dist/img'))
  }
  
  
  // webp images
  function webpImage() {
      return src('dist/img/*.{jpg, png}')
          .pipe(imagewebp())
          .pipe('dist/img')
  }
  
  
  // create watchlist
  function watchTask(){
      watch('src/scss/*.scss', compilescss);
      watch('src/js/*.js', jsmin);
      watch('src/img/*.{jpg,png}', optimizeimg);
      watch('dist/img/*.{jpg,png}', webpImage);
  }
  
  
  
  // default gulp
  exports.default = series(
      compilescss,
      jsmin,
      optimizeimg,
      webpImage,
      watchTask
  );
  </code></pre>
  <p>When I'm trying to run <code>gulp</code> command in the terminal. I'm getting errors like - <code>Error [ERR_REQUIRE_ESM]: require() of ES Module E:\Projects\portfolio\node_modules\gulp-imagemin\index.js from E:\Projects\portfolio\gulpfile.js not supported.</code></p>
  <p><a href="https://i.stack.imgur.com/PkZI3.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/PkZI3.jpg" alt="enter image description here" /></a></p>
  <p>I've tried solutions like - adding <code>type:&quot;module&quot;</code> in package.json and instead of <code>require()</code> used <code>import</code> but I couldn't make it work. So how can I fix this??? Thanks!</p>