帶你了解前端的幾種包管理器(npm/pnpm等)
npm
npm 是 Node.js 自帶的包管理器,平時(shí)通過(guò) npm install 命令來(lái)安裝各種 npm 包(比如:npm install vue-router ),就是通過(guò)這個(gè)包管理器來(lái)安裝的。 關(guān)于 npm 包下載鏡像源的設(shè)置:
# 查看下載源 npm config get registry # 綁定下載源 npm config set registry https://registry.npmmirror.com # 刪除下載源 npm config rm registry
npm 的 包的版本鎖定文件是 package-lock.json ,如果有管理多人協(xié)作倉(cāng)庫(kù)的需求,可以根據(jù)實(shí)際情況把它添加至 .gitignore 文件,便于統(tǒng)一團(tuán)隊(duì)的包管理。
cnpm
cnpm 是阿里巴巴推出的包管理工具,安裝之后默認(rèn)會(huì)使用 https://registry.npmmirror.com 這個(gè)鏡像源。
它的安裝命令和 npm 非常一致,通過(guò) cnpm install 命令來(lái)安裝(比如 cnpm install vue-router)。 在使用它之前,需要通過(guò) npm 命令進(jìn)行全局安裝:
npm install -g cnpm # 或者 npm install -g cnpm --registry=https://registry.npmmirror.com
cnpm 不生成 版本鎖定 lock 文件,也不會(huì)識(shí)別項(xiàng)目下的 lock 文件,所以還是推薦使用 npm 或者其他包管理工具,通過(guò)綁定鏡像源的方式來(lái)管理項(xiàng)目的包。
yarn
yarn 也是一個(gè)常用的包管理工具,和 npm 十分相似, npmjs 上的包,也會(huì)同步到 yarnpkg 。 也是需要全局安裝才可以使用:
npm install -g yarn
但是安裝命令上會(huì)有點(diǎn)不同, yarn 是用 yarn add 代替 npm install ,用 yarn remove 代替 npm uninstall ,例如:
# 安裝單個(gè)包 yarn add vue-router # 安裝全局包 yarn global add typescript # 卸載包 yarn remove vue-router
而且在運(yùn)行腳本的時(shí)候,可以直接用 yarn 來(lái)代替 npm run ,例如 yarn dev 相當(dāng)于 npm run dev 。 升級(jí)的時(shí)候用 yarn upgrade 代替 npm update命令。 yarn 默認(rèn)綁定的是 https://registry.yarnpkg.com 的下載源,如果包的下載速度太慢,也可以配置鏡像源,但是命令有所差異:
# 查看鏡像源 yarn config get registry # 綁定鏡像源 yarn config set registry https://registry.npmmirror.com # 刪除鏡像源(注意這里是 delete ) yarn config delete registry
yarn 的 版本鎖定文件是 yarn.lock ,如果有管理多人協(xié)作倉(cāng)庫(kù)的需求,可以根據(jù)實(shí)際情況把它添加至 .gitignore 文件,便于統(tǒng)一團(tuán)隊(duì)的包管理。
pnpm
pnpm 是包管理工具的一個(gè)后起之秀,主要優(yōu)點(diǎn)在于快速的、節(jié)省磁盤空間,如果你的包在一個(gè)項(xiàng)目中已經(jīng)下載了,其它項(xiàng)目再用到這個(gè)包就不需要再次下載,而是通過(guò)軟鏈接的方式關(guān)聯(lián)。用法跟其他包管理器很相似,沒(méi)有太多的學(xué)習(xí)成本, npm 和 yarn 的命令它都支持。 也是必須先全局安裝它才可以使用:
npm install -g pnpm
目前 pnpm 在開(kāi)源社區(qū)的使用率越來(lái)越高,包括接觸最多的 Vue / Vite 團(tuán)隊(duì)也在逐步遷移到 pnpm 來(lái)管理依賴。 pnpm 的下載源使用的是 npm ,所以如果要綁定鏡像源,按照 npm 的方式處理就可以了。
到此這篇關(guān)于帶你了解前端的幾種包管理器(npm/pnpm等)的文章就介紹到這了,更多相關(guān)包管理器npm內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
vue2.6.10+vite2開(kāi)啟template模板動(dòng)態(tài)編譯的過(guò)程
這篇文章主要介紹了vue2.6.10+vite2開(kāi)啟template模板動(dòng)態(tài)編譯,本文結(jié)合實(shí)例代碼給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2023-02-02
Vue中實(shí)現(xiàn)權(quán)限控制的方法示例
這篇文章主要介紹了Vue中實(shí)現(xiàn)權(quán)限控制的方法示例,小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2019-06-06
vue中el-form-item展開(kāi)項(xiàng)居中的實(shí)現(xiàn)方式
這篇文章主要介紹了vue中el-form-item展開(kāi)項(xiàng)居中的實(shí)現(xiàn)方式,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2023-10-10
Element?el-date-picker?日期選擇器的使用
本文主要介紹了Element?el-date-picker?日期選擇器的使用,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2023-04-04
vue中對(duì)象的賦值Object.assign({}, row)方式
這篇文章主要介紹了vue中對(duì)象的賦值Object.assign({}, row)方式,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2022-03-03
vue?動(dòng)態(tài)style?拼接寬度問(wèn)題
這篇文章主要介紹了vue?動(dòng)態(tài)style?拼接寬度問(wèn)題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2022-09-09
element-ui?tree?手動(dòng)展開(kāi)功能實(shí)現(xiàn)(異步樹也可以)
這篇文章主要介紹了element-ui?tree?手動(dòng)進(jìn)行展開(kāi)(異步樹也可以),項(xiàng)目中用到了vue的element-ui框架,用到了el-tree組件,需要的朋友可以參考下2022-08-08
vue cli 3.x 項(xiàng)目部署到 github pages的方法
這篇文章主要介紹了vue cli 3.x 項(xiàng)目部署到 github pages的方法,非常不錯(cuò),具有一定的參考借鑒價(jià)值 ,需要的朋友可以參考下2019-04-04
vue3中實(shí)現(xiàn)雙向數(shù)據(jù)綁定的方法
Vue3中,雙向數(shù)據(jù)綁定主要通過(guò)v-model指令實(shí)現(xiàn),v-model是一個(gè)語(yǔ)法糖,結(jié)合了v-bind和v-on指令來(lái)實(shí)現(xiàn)數(shù)據(jù)的雙向綁定,它在內(nèi)部做了綁定數(shù)據(jù)和監(jiān)聽(tīng)輸入事件兩件事,感興趣的朋友跟隨小編一起看看吧2024-12-12

