title: ReferenceError: require is not defined at gulpfile.js
body: <p>So, I am new to js development. What I am trying to do is to set up a basic environment to study and to be kind of a bootstrap, with gulp tasks and so on.</p>
  <p>I'm stuck in this error thrown in the terminal:</p>
  <pre><code>ReferenceError: require is not defined
  at file:///Users/henriquegodinho/Google%20Drive/Elucid%C3%A1rio.art/plugin/elucidario/gulpfile.js:12:12
  at ModuleJob.run (internal/modules/esm/module_job.js:146:23)
  at async Loader.import (internal/modules/esm/loader.js:165:24)
  </code></pre>
  <p>I did my homework before coming here to ask and tried to debug and search for an answer by myself, but all the search results for this is for client side implementation, but I'm doing this at the terminal - isn't this the server-side?</p>
  <p>node version:</p>
  <pre><code>$ node -v
  v14.13.0
  </code></pre>
  <p>npm version:</p>
  <pre><code>$ npm -v
  6.14.8
  </code></pre>
  <p>gulp version:</p>
  <pre><code>$ gulp -v
  CLI version: 2.3.0
  Local version: 4.0.2
  </code></pre>
  <p>the problem is when I run:</p>
  <pre><code>$ npm run gulp
  </code></pre>
  <p>gulpfile.json</p>
  <pre><code>// Gulp.js configuration
  'use strict';
  const
  
      // source and build folders
      dir = {
          src: 'src/',
          build: 'dist/'
      },
  
      // Gulp and plugins
      gulp = require('gulp'),
      gutil = require('gulp-util'),
      newer = require('gulp-newer'),
      imagemin = require('gulp-imagemin'),
      sass = require('gulp-sass'),
      postcss = require('gulp-postcss'),
      deporder = require('gulp-deporder'),
      concat = require('gulp-concat'),
      stripdebug = require('gulp-strip-debug'),
      uglify = require('gulp-uglify');
  
  // Browser-sync
  var browsersync = false;
  // PHP settings
  
  const php = {
      src: dir.src + 'php/**/*.php',
      build: dir.build
  };
  // copy PHP files
  gulp.task('php', () =&gt; {
      return gulp.src(php.src)
          .pipe(newer(php.build))
          .pipe(gulp.dest(php.build));
  });
  </code></pre>
  <p>package.json</p>
  <pre><code>{
      &quot;name&quot;: &quot;elucidario&quot;,
      &quot;version&quot;: &quot;0.1.0&quot;,
      &quot;description&quot;: &quot;&quot;,
      &quot;main&quot;: &quot;index.js&quot;,
      &quot;type&quot;: &quot;module&quot;,
      &quot;scripts&quot;: {
          &quot;wp-env&quot;: &quot;wp-env&quot;
      },
      &quot;author&quot;: &quot;&quot;,
      &quot;license&quot;: &quot;ISC&quot;,
      &quot;devDependencies&quot;: {
          &quot;@babel/core&quot;: &quot;^7.11.6&quot;,
          &quot;@babel/preset-env&quot;: &quot;^7.11.5&quot;,
          &quot;@babel/register&quot;: &quot;^7.11.5&quot;,
          &quot;@wordpress/env&quot;: &quot;^2.0.1&quot;,
          &quot;autoprefixer&quot;: &quot;^10.0.1&quot;,
          &quot;browser-sync&quot;: &quot;^2.26.12&quot;,
          &quot;css-mqpacker&quot;: &quot;^7.0.0&quot;,
          &quot;cssnano&quot;: &quot;^4.1.10&quot;,
          &quot;gulp&quot;: &quot;^4.0.2&quot;,
          &quot;gulp-clean-css&quot;: &quot;^4.3.0&quot;,
          &quot;gulp-concat&quot;: &quot;^2.6.1&quot;,
          &quot;gulp-deporder&quot;: &quot;^1.2.0&quot;,
          &quot;gulp-if&quot;: &quot;^3.0.0&quot;,
          &quot;gulp-imagemin&quot;: &quot;^7.1.0&quot;,
          &quot;gulp-newer&quot;: &quot;^1.4.0&quot;,
          &quot;gulp-postcss&quot;: &quot;^9.0.0&quot;,
          &quot;gulp-sass&quot;: &quot;^4.1.0&quot;,
          &quot;gulp-strip-debug&quot;: &quot;^3.0.0&quot;,
          &quot;gulp-uglify&quot;: &quot;^3.0.2&quot;,
          &quot;gulp-util&quot;: &quot;^3.0.8&quot;,
          &quot;postcss-assets&quot;: &quot;^5.0.0&quot;,
          &quot;yarg&quot;: &quot;^1.0.8&quot;
      },
      &quot;dependencies&quot;: {
          &quot;esm&quot;: &quot;^3.2.25&quot;
      }
  }
  </code></pre>
  <p>What am I doing wrong?</p>