npm私服 verdaccio 搭建

adouwt發表於2024-07-21
NPM

1、什麼是npm 私服

我們前端（web，nodejs）平常使用的各種包，什麼vue,react,react-router, zustand等，都會從 https://registry.npmjs.org/ 這個映象源上download， 當然我們國內開發為了download 方便，快速down下來，下載包的時候會指定國內映象源，比如淘寶映象。像這些提供給全網使用的映象服務，就是公共服務了。

公共服務服務全世界全網同胞，如果是公司內部使用的包，含一些定製化，私有化，不方便釋出到外網的元件或者package，應該如何處理呢？

常見的做法，

1、封裝成元件，下次哪個專案或者開發想要的時候，過來copy 下
2、提交到公司內網的gitlab（內網gitlab搭建） 上，然後在package.json 的依賴裡面，使用gitlab地址加分支名來使用該包
3、當然還有其他的奇淫技巧

上面的做法，都有相應的問題，如無法在同一個地方維護，新增的功能或者修復的bug 很難同步到各個專案，沒有版本概念等

如果有這麼一個像淘寶映象服務的私有服務是不是就能很絲滑使用？對的，npm 私服就能滿足我們私有化服務的要求

2、什麼是verdaccio

npm 服務有很多，比如sinopia, cnpm 等。但是你一google npm 私服，搜尋出來大部分的結果是 verdaccio。 毫無疑問，這個verdaccio 是受大家最歡迎的。github 地址，vedaccio，官網地址， 官網， 其他的廢話不多說，瞭解更多關於verdaccio 的內容，沒有比官網和github更全面了。

3、為什麼 要搭建npm 私服

至於為什麼要搭建npm 私服，第一點說明了一些背景也是原因，另外一個，私服搭建後，公司 cicd jekins 這類自動化構建工作在拉取這些包時，因為都是走內網,會比去公網拉取更快；npm 私服搭建也是前端自動化環節中很重要的一環；當然這個也算是技術 kpi中的一個。

4、如何搭建verdaccio

來來來，直接上官網。

Verdaccio 是一個 Node.js 私有和代理 registry。 在安裝之前，您需要確保系統環境已滿足以下條件。
最低要求:
Node.js v16 或者更高。
你喜愛的 Node 包管理器 npm、pnpm 或者 yarn（經典版和現代版）。
使用現代瀏覽器以訪問Web介面， 支援使用 Chrome、 Firefox、 Edge和IE11 瀏覽器。

安裝cli

npm install -g verdaccio

啟動

pm2 start verdaccio

pm2 是nodejs 程序管理的一個工具，這裡不做綴敘，pm2 這種方法 更適合前端同學或者nodejs 同學的使用。

上面的兩個命令執行之後，就可以訪問你的私服了。

這個方式可以在本地使用，也可以在liunx 伺服器上使用，沒有增加額外的心智負擔和額外的學習成本。

5、搭建後的使用

釋出元件

下面 100.000.100.1 是伺服器ip地址，瞎寫的，實際使用的時候 換成伺服器ip 即可

註冊使用者

npm adduser --registry http://100.000.100.1:4873

輸入賬號、密碼、郵箱 （這些都隨便填，但是要記住，下一步登入的時候 是需要這樣的內容的）

登入使用者

npm login --registry http://100.000.100.1:4873

輸入賬號、密碼、郵箱

npm publish 釋出元件

npm publish --registry http://100.000.100.1:4873

到這裡就能看到你元件了，

6、常見問題解決

私服主題定製，比如我要換個頭，換個腳，換一個 favicon 等，換成公司的或者自己的。請修改 verdaccio 的配置檔案中的 web 欄位。 配置檔案位置: /root/.config/verdaccio/config.yaml ，

vim /root/.config/verdaccio/config.yaml

# Verdaccio 監聽的主機和埠
listen: 0.0.0.0:4873
# 儲存包的位置
storage: ./storage
# 配置上游映象源的設定
uplinks:
  taobao:
    url: https://registry.npmmirror.com/

# 配置包的訪問許可權和範圍
packages:
  '@scope/*':
    access: $all
    publish: $authenticated
    proxy: taobao
# Verdaccio 的身份驗證設定
auth:
  htpasswd:
    file: ./htpasswd
# 配置 Verdaccio 中介軟體的設定
middlewares:
  audit:
    enabled: true
# 配置 Verdaccio 的日誌記錄設定
logs:
  - { type: stdout, format: pretty, level: http }
  - { type: file, path: verdaccio.log, level: info }
# 配置 Verdaccio 的 Web 介面設定
web:
  title: Verdaccio
  logo: logo.png
  theme: default
# 配置 Verdaccio 的安全設定
security:
  api:
    jwt:
      sign:
        expiresIn: 7d
      verify:
        maxAge: 7d
  web:
    headers:
      X-Content-Type-Options: 'nosniff'
      X-Frame-Options: 'deny'
      X-XSS-Protection: '1; mode=block'

修改結束後，需要重新啟動下 verdaccio, 才能讓配置檔案生效

pm2 restart verdaccio

npm install 時，控制檯 報 500 internal error

其他

1、域名配置，不要ip訪問

2、配置https 證書

3、自動釋出元件&更新元件 version 號

上面的幾個問題，都已經解決，目前因為篇幅原因、時間等原因，本篇不做詳細展開，會在下一篇做詳細解釋。

本篇內容不是很適合沒有一點linux基礎或者 nodejs的同學,相關知識 麻煩單獨學習下， 比如 linux伺服器購買，linux 伺服器的基本命令使用，pm2 的安裝和使用。也可以加群一起討論。

8、尋找正在使用或者想用verdaccio的道友

如果需要或者喜歡用verdaccio的朋友，歡迎加我微信（備註 verdaccio， 或者npm 私服）拉群一起討論使用。
目前這套私服已經在為公司服務，使用時間越長，問題就會越多，歡迎一起參與討論，讓私服更穩定，更好用

相關文章