ReferenceError: require is not defined at gulpfile.js

ReferenceError: require is not defined at gulpfile.js

所以,我是js开发新手。我想做的是建立一个基本的学习环境,成为一个 bootstrap,有 gulp 任务等等。

我被终端抛出的这个错误困住了:

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)

我在来这里问之前做了功课,并尝试自己调试和搜索答案,但是所有搜索结果都是针对客户端实现的,但我是在终端上做的-不是这不是服务器端吗?

节点版本:

$ node -v
v14.13.0

npm 版本:

$ npm -v
6.14.8

gulp版本:

$ gulp -v
CLI version: 2.3.0
Local version: 4.0.2

问题是当我 运行:

$ npm run gulp

gulpfile.json

// 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

{
    "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"
    }
}

我做错了什么?

您的 package.json 中似乎没有 gulp 运行 脚本,您还想从 package.json 中删除 "type": "module"导致 require/esm.

出现问题

这是我对您的 package.json 文件所做的编辑

{
"name": "elucidario",
"version": "0.1.0",
"description": "",
"main": "index.js",
"scripts": {
    "wp-env": "wp-env",
    "gulp": "node ./node_modules/gulp/bin/gulp.js php"
},
"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",
    "gulp-babel": "^8.0.0"
}

}

同时将您的 gulp 文件重命名为

gulpfile.babel.js