如何統(tǒng)一前端項(xiàng)目的 Node 版本和包管理器？
大廠技術(shù) 高級(jí)前端 Node進(jìn)階
點(diǎn)擊上方 程序員成長(zhǎng)指北，關(guān)注公眾號(hào)
回復(fù)1，加入高級(jí)Node交流群
通過文檔和溝通約束，遠(yuǎn)不如用工具（代碼）約束。
作者：亖混子
原文：https://segmentfault.com/a/1190000041918155
開發(fā)環(huán)境
Node.js Package Manager （npm、yarn、pnpm）
痛點(diǎn)問題
成員機(jī)器 Node.js 版本不統(tǒng)一：守舊派用 12.x、保守用 14.x、激進(jìn)用 17.x。項(xiàng)目能否正常跑起來全憑天意，在沒有 CICD 流水線加持本地 npm run build 的場(chǎng)景下線上風(fēng)險(xiǎn)可想而知。
有人習(xí)慣用 npm、有人習(xí)慣用 yarn, 代碼庫里面經(jīng)常會(huì)存在 package-lock.json、yarn.lock 文件同時(shí)存在的情況。更痛的點(diǎn)還是各種奇奇怪怪問題排查起來沒有頭緒。
我們要做的就是將問題掐死在源頭：鎖定 Node.js 版本和包管理器
鎖定項(xiàng)目 Node 版本
通過在 package.json 中指定 engines 字段，可限定項(xiàng)目使用的 node 版本。下面配置僅允許用戶使用 14 或者 16的版本。更多的配置可以參考 package.json | npm Docs 、semver
// package.json
"engines": {
"node": "14.x || 16.x"
},
配置之后你會(huì)發(fā)現(xiàn)，該字段只對(duì) yarn 生效。那如何對(duì) npm 也生效呢？在項(xiàng)目根目錄下的 .npmrc 文件中增加如下配置
// .npmrc
engine-strict = true
以上配置完成后，npm install 試試吧，錯(cuò)誤的 Node.js 將直接退出
鎖定包管理器
利用 only-allow 工具包、npm scripts 快速實(shí)現(xiàn)鎖定。
步驟一：在項(xiàng)目中 npm install -D only-allow
步驟二：在 package.json 文件中進(jìn)行配置 scripts.preinstall ， 允許輸入的值 only-allow npm、only-allow pnpm、only-allow yarn
// package.json
"scripts": {
"preinstall": "only-allow npm",
...
}
以上配置完成后，可以再亂用 （yarn、npm、pnpm） 試試
Node 社群
我組建了一個(gè)氛圍特別好的 Node.js 社群，里面有很多 Node.js小伙伴，如果你對(duì)Node.js學(xué)習(xí)感興趣的話（后續(xù)有計(jì)劃也可以），我們可以一起進(jìn)行Node.js相關(guān)的交流、學(xué)習(xí)、共建。下方加 考拉 好友回復(fù)「Node」即可。
如果你覺得這篇內(nèi)容對(duì)你有幫助，我想請(qǐng)你幫我2個(gè)小忙：
1. 點(diǎn)個(gè)「在看」，讓更多人也能看到這篇文章 2. 訂閱官方博客 www.inode.club 讓我們一起成長(zhǎng) 點(diǎn)贊和在看就是最大的支持