title: Requiring external module @babel/register ReferenceError: require is not defined
body: <p>I have a front-end build, which I was given and which I am trying to get to build. Whenever I run <code>yarn run dev</code>, I get the following:</p>
  <pre><code>(base) ➜  project git:(master) ✗ yarn run dev
  yarn run v1.22.17
  $ gulp
  [22:18:45] Requiring external module @babel/register
  ReferenceError: require is not defined
      at file:///home/user/sites/project/gulpfile.babel.js:5:20
      at ModuleJob.run (internal/modules/esm/module_job.js:145:37)
      at async Loader.import (internal/modules/esm/loader.js:182:24)
  error Command failed with exit code 1.
  info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
  </code></pre>
  <p>What can I do to troubleshoot and fix this?</p>
  <p>My installation steps were as follows:</p>
  <pre><code>yarn global add gulp-cli
  yarn global add bem-tools-core
  yarn
  yarn run dev
  </code></pre>
  <p>I have tried installing with <code>npm</code> as well, just in case it might make a difference. It does not. The same error persists.</p>
  <p>The top of the <code>gulpfile.babel.js</code> looks as follows:</p>
  <pre><code>&quot;use strict&quot;;
  
  import gulp from &quot;gulp&quot;;
  
  const requireDir = require(&quot;require-dir&quot;),
      paths = {
          views: {
              src: [
                  &quot;./src/views/index.pug&quot;,
                  &quot;./src/views/pages/*.pug&quot;
              ],
  </code></pre>
  <p>The <code>package.json</code> is like this:</p>
  <pre><code>{
      &quot;name&quot;: &quot;gulp-pug-starter&quot;,
      &quot;description&quot;: &quot;Frontend development with pleasure&quot;,
      &quot;author&quot;: &quot;Andrey Gorokhov&quot;,
      &quot;repository&quot;: {
          &quot;type&quot;: &quot;git&quot;,
          &quot;url&quot;: &quot;https://github.com/andreyalexeich/gulp-pug-starter.git&quot;
      },
      &quot;license&quot;: &quot;MIT&quot;,
      &quot;type&quot;: &quot;module&quot;,
      &quot;babel&quot;: {
      &quot;presets&quot;: [
          &quot;es2015&quot;
      ]
      },
      &quot;scripts&quot;: {
          &quot;dev&quot;: &quot;gulp&quot;,
          &quot;build&quot;: &quot;gulp prod --production&quot;,
          &quot;build:views&quot;: &quot;gulp views --production&quot;,
          &quot;build:styles&quot;: &quot;gulp styles --production&quot;,
          &quot;build:scripts&quot;: &quot;gulp scripts --production&quot;,
          &quot;build:images&quot;: &quot;gulp images --production&quot;,
          &quot;build:webp&quot;: &quot;gulp webp --production&quot;,
          &quot;build:sprites&quot;: &quot;gulp sprites --production&quot;,
          &quot;build:fonts&quot;: &quot;gulp fonts --production&quot;,
          &quot;build:favicons&quot;: &quot;gulp favicons --production&quot;,
          &quot;build:gzip&quot;: &quot;gulp gzip --production&quot;,
          &quot;lint:styles&quot;: &quot;stylelint \&quot;src/**/*.scss\&quot; --syntax=scss&quot;,
          &quot;lint:styles --fix&quot;: &quot;stylelint \&quot;src/**/*.scss\&quot; --syntax=scss --fix&quot;,
          &quot;lint:scripts&quot;: &quot;eslint --color ./src/blocks&quot;,
          &quot;lint:scripts --fix&quot;: &quot;eslint --fix --color ./src/blocks&quot;,
          &quot;bem-c&quot;: &quot;bem create $* -l src/blocks/components&quot;,
          &quot;bem-m&quot;: &quot;bem create $* -l src/blocks/modules&quot;
      },
      &quot;devDependencies&quot;: {
          &quot;@babel/core&quot;: &quot;^7.4.3&quot;,
          &quot;@babel/preset-env&quot;: &quot;^7.4.3&quot;,
          &quot;@babel/register&quot;: &quot;^7.17.0&quot;,
          &quot;babel-eslint&quot;: &quot;~10.1.0&quot;,
          &quot;babel-loader&quot;: &quot;^8.0.5&quot;,
          &quot;babel-register&quot;: &quot;^6.26.0&quot;,
          &quot;bem-tools-core&quot;: &quot;bem-tools/bem-tools-core&quot;,
          &quot;bem-tools-create&quot;: &quot;bem-tools/bem-tools-create&quot;,
          &quot;browser-sync&quot;: &quot;^2.23.6&quot;,
          &quot;del&quot;: &quot;^5.1.0&quot;,
          &quot;eslint&quot;: &quot;~7.7.0&quot;,
          &quot;gulp&quot;: &quot;^4.0.0&quot;,
          &quot;gulp-autoprefixer&quot;: &quot;~7.0.1&quot;,
          &quot;gulp-clean-css&quot;: &quot;~4.3.0&quot;,
          &quot;gulp-debug&quot;: &quot;~4.0.0&quot;,
          &quot;gulp-favicons&quot;: &quot;^2.3.1&quot;,
          &quot;gulp-group-css-media-queries&quot;: &quot;^1.2.2&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-plumber&quot;: &quot;^1.2.0&quot;,
          &quot;gulp-pug&quot;: &quot;^4.0.1&quot;,
          &quot;gulp-rename&quot;: &quot;^2.0.0&quot;,
          &quot;gulp-replace&quot;: &quot;^1.0.0&quot;,
          &quot;gulp-sass&quot;: &quot;~4.1.0&quot;,
          &quot;gulp-sourcemaps&quot;: &quot;^2.6.4&quot;,
          &quot;gulp-svg-sprite&quot;: &quot;^1.5.0&quot;,
          &quot;gulp-watch&quot;: &quot;^5.0.0&quot;,
          &quot;gulp-webp&quot;: &quot;^4.0.1&quot;,
          &quot;husky&quot;: &quot;^4.2.1&quot;,
          &quot;imagemin-giflossy&quot;: &quot;^5.1.10&quot;,
          &quot;imagemin-jpeg-recompress&quot;: &quot;~7.0.0&quot;,
          &quot;imagemin-mozjpeg&quot;: &quot;^9.0.0&quot;,
          &quot;imagemin-pngquant&quot;: &quot;~9.0.0&quot;,
          &quot;imagemin-webp&quot;: &quot;^6.0.0&quot;,
          &quot;imagemin-zopfli&quot;: &quot;^7.0.0&quot;,
          &quot;lint-staged&quot;: &quot;^10.0.3&quot;,
          &quot;require-dir&quot;: &quot;^1.2.0&quot;,
          &quot;stylelint&quot;: &quot;^13.6.1&quot;,
          &quot;stylelint-order&quot;: &quot;^4.1.0&quot;,
          &quot;stylelint-selector-bem-pattern&quot;: &quot;^2.1.0&quot;,
          &quot;webpack&quot;: &quot;~4.44.1&quot;,
          &quot;webpack-stream&quot;: &quot;^5.2.1&quot;,
          &quot;yargs&quot;: &quot;~15.4.1&quot;
      },
      &quot;dependencies&quot;: {
          &quot;bootstrap&quot;: &quot;^5.1.1&quot;,
          &quot;gsap&quot;: &quot;./gsap-bonus.tgz&quot;,
          &quot;headroom.js-latest&quot;: &quot;^0.9.6&quot;,
          &quot;jquery&quot;: &quot;^3.6.0&quot;,
          &quot;jquery-ui_1.12&quot;: &quot;^1.12.0&quot;,
          &quot;magnific-popup&quot;: &quot;^1.1.0&quot;,
          &quot;owl.carousel&quot;: &quot;^2.3.4&quot;,
          &quot;popper.js&quot;: &quot;^1.16.1&quot;,
          &quot;smart-grid&quot;: &quot;^2.1.2&quot;,
          &quot;swiper&quot;: &quot;6.8.4&quot;
      },
      &quot;husky&quot;: {
          &quot;hooks&quot;: {
              &quot;pre-commit&quot;: &quot;lint-staged&quot;
          }
      },
      &quot;lint-staged&quot;: {
          &quot;!(_*).scss&quot;: [
              &quot;stylelint --fix --color --config ./.stylelintrc&quot;
          ],
          &quot;*.js&quot;: [
              &quot;eslint --fix --color&quot;
          ]
      }
  }
  </code></pre>