背景

为了打包构建之前的 element-theme，用到了gulp，但是遇到的坑，记录一下。

报错如下

fs.js:40
} = primordials;
    ^
ReferenceError: primordials is not defined
at fs.js:40:5

ReferenceError: primordials is not defined 意思是primordials这个没被定义，是因为项目中gulp版本和node版本不兼容，先看下本地的版本：

gulp --version

CLI version: 2.3.0
Local version: 3.9.1'

node -version

v14.21.0

node >=12 && gulp <= 3的话，他们的版本不兼容，我本地是14的版本。

解决方法 找到原因后，有两种解决方法，降级node或升级gulp

解决方法之：降级node 不建议用这种方法，毕竟时代在进步，还是不要倒退的好, 所以这种方法直接 pass 那就用另一个解决方法，使用npm shrinkwrap锁定依赖版本：

解决方法之：升级gulp（1）

• 1、项目根目录新建npm-shrinkwrap.json
• 2、npm-shrinkwrap.json内容修改如下：

{
  "dependencies": {
    "graceful-fs": {
        "version": "4.2.2"
     }
  }
}

然后重新执行npm install，这时候再去执行gulp相关操作就不会报错了。

注意：这个文件在执行过一次npm install以后，就失效了，下次再执行就没有效果了, 所以，最好不要把它加入版本控制里后再加入 .gitignore，这样本地执行，其它合作伙伴拉取 后无感知安装

解决方法之：升级gulp（2）

在package.json文件里加入以下代码：

{
  "scripts": {
    "preinstall": "npx npm-force-resolutions"
  },
  "resolutions": {
    "graceful-fs": "4.2.2"
  }
}

注意：此方案有毒

原因： package.json中"preinstall": "npx npm-force-resolutions"强制npm安装特定的传递依赖项版本，该命令需要package-lock.json

解决方法：先注释掉 //”preinstall”: “npx npm-force-resolutions”, 然后npm install生成 package-lock.json 文件，最后再取消注释重新安装。