前端项目限制环境版本

前言

在如今这个前端项目框架较为成熟的年代，一个前端项目涉及到多个依赖，而这个项目的依赖又是居于项目的版本来的。所以一个大型的项目，多人进行联合开发的时侯，A 说项目启动不起来了，B 说安装包依赖出现一长串错误。C 水打包出现报错了。一开始遇到这种问题，没有经验的话很难发现问题的所在。所以在项目中限制安全运行环境版本，是一个很好的规避方式。本文以 pnpm,yarn 和 npm 这 3 种常见的包管理器做例子说明。

配置 engines

在npm-package的文档中有提到如何指定 Node.js 版本。通过在 package.json 中通过 engines 的字段来指定版本。

"engines": {
	"node": ">=16.16.0",
	"pnpm": ">=7.26.3"
}

然后再在项目的根目录新建 `.npmrc` 文件，添加如下内容，启动严格模式。这样就会在版本不符合的时候提示
engine-strict = true

这样在执行 [npm|yarn|pnpm] install 安装项目依赖的时候，会检查 node 版本是否大于 16.16.0 并且 pnpm 大于等于 7.26.3 版本才能正确安装。

自动检测版本

上面的是手动进行检测版本，那么我们都希望像 npm run dev 这样自动检测版本。那么就需要在 package.json中加入指令

{
  "script": {
    "check-env": "echo check environment successfully"
  }
}

之后可以运行 pnpm run check-env和 yarn run check-env ，这里没有写 npm的情况，主要是这个对于 npm没有作用。

npm 自动检测版本

npm 检测版本需要搭配 semver 的插件写一个脚本来实现。

npm i semver

semver 是一个语义版本检测器

const semver = require("semver");
const { engines } = require("./package"); // 这里的package是你的package.json文件路径
const version = engines.node;

if (!semver.satisfies(process.version, version)) {
  console.log(
    [
      "node环境变量版本错误",
      "你的node环境启动位置" + process.mainModule.path + ".",
      "要求环境版本" + version,
      "你的环境版本" + process.version,
    ].join("\n")
  );
  process.exit(1);
} else {
  console.log(`echo check environment successfully`);
}

{
  "scripts": {
    "check-env": "node srcipts/checkver.js" // 脚本相对于根目录的位置
  }
}

再次运行 npm run check-env 就能看到提示了

限定包管理器

{
  "srcipt": {
    "preinstall": "npx only-allow pnpm"
  }
}

此时如果用非 pnpm的包管理器就会提示错误