前端verdaccio搭建npm私服(linux)+客戶端使用包

前言
最近想在公司內(nèi)網(wǎng)上搭建一個npm服務(wù),只供公司內(nèi)部使用。有兩個工具sinopia的github地址verdaccio的github地址,但是sinopia在四年前已經(jīng)停止更新了,沒人維護了,留下許多坑。幸好有一群大佬又從sinopia開了一個分支,更名為verdaccio。最近的一次更新我看是在10小時前~
verdaccio官網(wǎng)

搭建npm私服的好處

1、包在公司內(nèi)部自己的服務(wù)器上,不會發(fā)布到外網(wǎng);
2、下載包和發(fā)布包都有權(quán)限管理
3、項目中我們用到包可以直接緩存在我們自己到服務(wù)器,不用再到npm中下載,直接從服務(wù)器中下載,速度得到提升,比淘寶鏡像的速度還快
4、可以將公司自己開發(fā)到包,發(fā)布到服務(wù)上,供公司內(nèi)部使用

1、 服務(wù)器端搭建

1.1、在你的Linux服務(wù)端安裝node環(huán)境

node -v //查看是否已經(jīng)安裝過node,已經(jīng)安裝跳過此步驟

有兩種方式下載:
1、下載到本地后上傳到服務(wù)器下載地址
2、wget下載到本地目錄

$ wget https://nodejs.org/dist/v9.3.0/node-v9.3.0-linux-x64.tar.xz

解壓及重命名:

$ xz -d node-v9.3.0-linux-x64.tar.xz 
$ tar -xf node-v9.3.0-linux-x64.tar
$ mv node-v9.3.0-linux-x64 node-v9.3.0

設(shè)置node全局環(huán)境變量

vi .bash_profile  // 修改用戶環(huán)境變量文件

鍵入i,進入插入模式

export NODE_HOME=/usr/local/node-v9.3.0/bin
export PATH=$PATH:$NODE_HOME

Esc退出插入模式,shift+;后輸入wq保存并且退出
讓修改的環(huán)境變量文件生效

source .bash_profile

驗證

node -v
npm -v

1.2 安裝verdaccio(加上–unsafe-perm的原因是防止報grywarn權(quán)限的錯)

npm install -g verdaccio --unsafe-perm

1.3 修改配置文件

vi /root/.config/verdaccio/config.yaml

在配置文件末尾最后添加監(jiān)聽端口

listen: 0.0.0.0:4873 // verdaccio 默認端口
image.png

1.4 啟動verdaccio

verdaccio
image.png

到這里就可以看到我們啟動成功的頁面了,在瀏覽器中訪問我們服務(wù)端的ip:


image.png

helloworld是我已經(jīng)上傳的一個測試包。

1.5 利用pm2一直守護verdaccio進程

直接使用 verdaccio雖然可以正常啟動,但是不能一直保持進程開啟,所以我們可以使用pm2來對verdaccio進程進行托管啟動

1.5.1 安裝pm2
npm install -g pm2 --unsafe-perm
1.5.2 pm2啟動verdaccio
pm2 start verdaccio
1.5.3 查看pm2 守護下的進程verdaccio的實時日志
pm2 show verdaccio 

通過這個命令我們可以從下圖中看到所有verdaccio的所有信息,打開 out log path查看進程輸出日志,出現(xiàn)錯誤時候也可以打開error log來查看錯誤日志


image.png

查看該路徑下對日志命令:

tail /root/.pm2/logs/verdaccio-out.log
1.5.4 添加用戶
npm adduser --registry http://172.29.XX.XX:4873        //后面是我們的私服地址

會讓你輸入用戶名、密碼、郵箱即可~
然后可以在頁面中登錄

image.png

2、 客戶端使用

2.1 設(shè)置下載源

如上,我們使用的服務(wù)端的ip地址為172.29.xx.39:4873
查看npmrc文件內(nèi)容,此文件內(nèi)容是npm鏡像下載源的地址

cat .npmrc //linux用cat,window用type

此時我們可以看到當(dāng)我們使用npm下載包時候,鏡像源是npmjs.org. 所以我們使用命令將下載源的地址切換到我們到服務(wù)器

npm set registry 172.29.xx.39:4873 

2.2 安裝nrm

nrm是 npm registry 管理工具, 能夠查看(nrm ls)和切換(nrm use xx)當(dāng)前使用的registry。不安裝也可以,安裝會更高效。

npm install -g nrm

2.3 添加自己服務(wù)器到地址到nrm

這里為了方便,我給自己服務(wù)器到地址取了一個別名,為了使用和切換更方便

nrm add my39 http://172.29.xx.39:4873 

這里你可以查看當(dāng)前有哪些下載源:

nrm ls
image.png

將npm包的下載地址改到my39的私服

nrm use my39

關(guān)于nrm
其實nrm只是個npm registry 管理工具,有了它可以讓我們切換和查看registry 地址更方便快捷,即便沒有它,我們直接用npm的set命令也可以切換地址,用cat命令也可以查看地址,只不過用nrm更便捷,用不用隨你了,覺得方便就用。

2.4 發(fā)布包

在桌面新建一個HelloWorld文件夾,里面放如index.js和README.md,然后打開命令行,切換到HelloWorld文件目錄下

npm init 

根據(jù)提示填寫,會自動生成一個package.json文件
到這里就可以使用npm publish 命令來發(fā)布包了

npm publish // 在服務(wù)器地址的情況下
npm publish --registry http://172.29.xx.39:4873 //在客戶端的情況下,直接加后綴發(fā)布到私服

如果你在客戶端未登錄到情況下,它會給你提示讓你去登錄

npm login

輸入用戶名、密碼、郵箱,然后再執(zhí)行:

npm publish --registry http://172.29.xx.39:4873

2.5 驗證能否下載

image.png

最后

當(dāng)我們執(zhí)行npm install的時候,它是根據(jù)當(dāng)前定位文件夾下package.json文件去下載包,包括間接依賴的包第一次下載之后的包都會緩存在我們的私服上,然后后期下載的時候從私服下載,就不會再從npmjs上下載包,但是它下載每個包的時候都會再走一遍npmjs去檢查包的版本,即便不下載資源,但這無疑也浪費了時間。經(jīng)驗證發(fā)現(xiàn),我們的package-lock.json文件在此刻起了大作用,因為package-lock.json文件本來就是更新node庫后自動生成的文件,里面包含了node庫中所有包的下載地址當(dāng)前版本以及包之間的依賴關(guān)系,既然package-lock.json穩(wěn)定了版本,所以當(dāng)我們項目中包含了這個文件時,我們下包時就會根據(jù)package-lock.json的穩(wěn)定版本來,就不會再去npmjs上去檢查了,這樣會極大的提升下載包的速度。所以項目中一定要有穩(wěn)定的package.json和package-lock.json文件,并及時更新這兩個文件

注意:如果我們在項目中用了npm-shrinkwrap.json這個文件來鎖定版本,我們在安裝包的時候可能會報錯Maximum call stack size exceeded。

解決方案:
1、刪除npm-shrinkwrap.jsonyarn.lock
2、刪除node_modules

sudo rm -rf node_modules

3、重新安裝包,生成package-lock.json文件

sudo npm install

成功之后,你會看到package-lock.json中鎖定的下載地址都是我們私服上的地址

尊重原創(chuàng),我只是在基礎(chǔ)添加了一點自己踩的坑,然后自己做個記錄~~

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

友情鏈接更多精彩內(nèi)容