ReferenceError: require is not defined at gulpfile.js

admin

Administrator
Staff member
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.
I'm stuck in this error thrown in the terminal:
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)
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?
node version:
Code:
$ node -v
v14.13.0
npm version:
Code:
$ npm -v
6.14.8
gulp version:
Code:
$ gulp -v
CLI version: 2.3.0
Local version: 4.0.2
the problem is when I run:
Code:
$ npm run gulp
gulpfile.json
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', () => {
    return gulp.src(php.src)
        .pipe(newer(php.build))
        .pipe(gulp.dest(php.build));
});
package.json
Code:
{
    "name": "elucidario",
    "version": "0.1.0",
    "description": "",
    "main": "index.js",
    "type": "module",
    "scripts": {
        "wp-env": "wp-env"
    },
    "author": "",
    "license": "ISC",
    "devDependencies": {
        "@babel/core": "^7.11.6",
        "@babel/preset-env": "^7.11.5",
        "@babel/register": "^7.11.5",
        "@wordpress/env": "^2.0.1",
        "autoprefixer": "^10.0.1",
        "browser-sync": "^2.26.12",
        "css-mqpacker": "^7.0.0",
        "cssnano": "^4.1.10",
        "gulp": "^4.0.2",
        "gulp-clean-css": "^4.3.0",
        "gulp-concat": "^2.6.1",
        "gulp-deporder": "^1.2.0",
        "gulp-if": "^3.0.0",
        "gulp-imagemin": "^7.1.0",
        "gulp-newer": "^1.4.0",
        "gulp-postcss": "^9.0.0",
        "gulp-sass": "^4.1.0",
        "gulp-strip-debug": "^3.0.0",
        "gulp-uglify": "^3.0.2",
        "gulp-util": "^3.0.8",
        "postcss-assets": "^5.0.0",
        "yarg": "^1.0.8"
    },
    "dependencies": {
        "esm": "^3.2.25"
    }
}
What am I doing wrong?