1.前言
阅读本文,你将学到:
1.npm脚本钩子:preinstall;
2.npx命令;
3.only-allow库;
4.一行代码 'preinstall':'npx only-allow npm' 实现约束使用npm包管理器;
2.场景
前端项目在开发中,需要安装依赖,而安装依赖有多种方式,比如:npm、yarn和pnpm; 当团队中有多人协同开发时,务必是要使用同一个包管理器的,一般的做法是在md文档中约束, 但是总会有人不看文档,或者一时疏忽使用了另外的包管理器,比如说项目中使用的是npm,而一个人却使用了yarn安装了依赖,并且上传了代码,这样就很有可能因为包版本的问题导致项目有bug,今天我们就使用一行代码进行强制约束,解决这个问题。
3.环境准备
1. node v14.16.0
2. npm v6.14.11
3. yarn v1.22.11
4. git bash
4.代码演示
4.1 新建limit-package文件夹
mkdir limit-package && cd limit-package
4.2 初始化项目
// -y 省略了自己设置项目名称的步骤
npm init -y
4.3 新增script脚本
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"preinstall": "npx only-allow npm" // 新增
},
新增"preinstall": "npx only-allow npm"一行代码,意思就是只允许使用npm管理器。
4.4 验证结果
这时候我们使用yarn管理器安装依赖,看是否能够安装成功,在根目录执行yarn add chalk -D(chalk是一个丰富打印内容的npm包),这时候终端会报错,并提示错误:
可以看到,在终端提示了Use "npm install" for installation in this project错误信息,而且项目中没有出现node_modules文件夹和yarn.lock文件,说明已经成功限制了使用yarn包管理器。
yarn虽然限制使用了,接下来我们试下使用npm来安装,如果能够正常安装依赖,说明我们期望的功能已经实现。
在根目录下执行npm install chalk -D:
从上边两张图片可以看出,已经成功安装了chalk这个包,说明npm包管理器可以正常使用。
5.原理
"preinstall": "npx only-allow npm"这行代码我们一一解释。
首先,preinstall是 npm 官方提供的钩子,在执行npm install或yarn add时,会触发preinstall对应的脚本;
其次,是npx only-allow npm这行代码:
npm 从5.2版本开始,增加了 npx 命令,主要作用是 调用项目安装的模块,执行依赖模块内的二进制文件,具体可以看一下 阮一峰老师的文章,简单来说就是执行 only-allow这个包的代码,其实这个包的源码也很少,仅仅只有36行,这里是 only-allow包的github地址。
6.总结
通过这篇文章,我们学到了通过从团队需要规范统一包管理器的实际场景出发,用"preinstall": "npx only-allow npm"一行代码就能实现需求。我们也了解了npx命令的使用,学习了npm的预安装钩子preinstall的使用,也了解了only-allow这个包的使用,其实only-allow这个包在vite的 源码 中也在使用,如下图所示: