【前端-NPM私服】内网使用verdaccio搭建私有npm服务器-docker搭建verdaccio流程

这篇具有很好参考价值的文章主要介绍了【前端-NPM私服】内网使用verdaccio搭建私有npm服务器-docker搭建verdaccio流程。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

文章已收录至https://lichong.work,转载请注明原文链接。
ps:欢迎关注公众号“Fun肆编程”或添加我的私人微信交流经验🤝

一、npm私服是什么

1. 定义

在私有化的服务器上部署的一个支持发布、下载、版本管理等服务的npm仓库。

2. 为什么需要npm私服

  • 官方npmjs下载缓慢,需要设置镜像源

    镜像源:是以一定频率定时同步npm官方仓库,以此代替官方仓库,提高包下载速度,也属于私服的一种

    • 淘宝镜像源 https://registry.npmmirror.com
    • 腾讯镜像源 https://mirrors.cloud.tencent.com/npm
    • 华为镜像源 https://mirrors.huaweicloud.com/repository
  • 公司自己封装的组件库,不希望在网络上公开。传统方式是在每个项目里复制一遍,但组件库一旦有改动,就需要重新复制一遍,因此就需要有一个私有仓库来管理每一个组件

二、npm私服如何使用

1. 链接到npm私服

通常在一个项目中既有公共的开源组件也有公司的私有组件,利用配置.npmrc可以实现从不同的镜像源下载,但是这样做会很麻烦,举个例子如下:

react包从淘宝镜像源下载,@company-plus/util包从私服下载,需要配置.npmrc

# 淘宝镜像源
registry=https://npmmirror.com
# 私有源
@company-plus:registry=http://192.168.103.37:5000

当然这样做有时也会有好处,就是如果你是在公司外网(通过VPN等方式)访问私服的话可能网络带宽没那么大,下载包会很慢,这时候这种分开镜像源的优势就会有所体现了。

我比较推荐的方式,还是利用npm私服的上行链路功能,把多个仓库聚合成一个下载入口,上面的例子.npmrc只需要配置一个私服地址registry=http://192.168.103.37:5000就可以了。

2. 注册私服账号

执行命令输入用户名、密码、邮箱即可:

npm adduser --registry http://192.168.103.37:5000/

npm 9.x及以上版本同学,执行npm adduser时需要使用--auth-type=legacy进行兼容,官方回应是9.x之后版本开始将会使用registerlogin命令,开始废弃adduser(目前register功能还未开发完成,所以需要使用兼容模式的adduser

npm adduser --registry http://192.168.103.37:5000/ --auth-type=legacy

3. 发布组件到私服

npm login登录后在需要发布组件的文件夹内执行:

npm publish --registry http://192.168.103.37:5000/

4. 关联LDAP服务

Verdaccio 支持关联LDAP服务,如果企业有LDAP服务,可以通过配置连接至公司的LDAP服务,使用公司的账号进行登录,同时关闭注册功能,这样可以更精准控制包的权限。配置方式如下:

auth:
  activedirectory:
    url: 'ldap://10.0.1.1'
    baseDN: 'dc=sample,dc=local'
    domainSuffix: 'sample.local'

5. 提高下载速度

从私服下载的包会缓存到服务器中,下载同一个包时会优先从缓存中读取,找不到再从镜像源或官方仓库下载(类似pnpm)

缓存策略也可以配置存储空间大小,保存周期等,防止磁盘撑爆

三、私服搭建方案

方案 支持仓库 是否收费 npm仓库易用性 是否维护
Verdaccio npm 开源 ★★★★★
JFrog Artifactory docker、npm、maven、pypi… 收费 ★★★★
Nexus 开源版 maven,npm,docker,pypi… 开源 ★★★
Sinopia npm 开源

推荐 Verdaccio 最大的原因有以下几点:

  • 一是支持完整的 npm 命令
  • 二是友好的 web 界面更接近 npmjs 官方界面,更利于查看和维护我们的组件
  • 三是安装较其他方案更简单
  • 四是内置身份验证,账号注册登录功能,且可以通过插件扩展 LDAP 验证方式,适合企业使用
  • 五是有包管理的权限控制,可以限制某些包的访问、下载、发布、撤销发布操作
  • 六是支持 webhook ,通过npm publish 发布包时,可发送通知

四、docker搭建Verdaccio流程

传统搭建方式查看此篇文章【前端-NPM私服】内网使用verdaccio搭建私有npm服务器

1. 拉镜像

docker pull verdaccio/verdaccio

2. 创建卷

为了更好的维护 Verdaccio ,通常情况下,我们会把 Verdaccio 工作目录中重要的三个文件夹(conf:配置文件、plugins:插件、storage:存储的包和账户)从容器中挂载到物理机上,并且应该使用 Volumes 卷存储挂载,而不是 Bind mounts 绑定挂载,否则会有权限问题。

docker volume create verdaccio-conf
docker volume create verdaccio-plugins
docker volume create verdaccio-storage

3. 启动容器

封装个启停脚本

启动脚本start-verdaccio.sh

#!/bin/bash
echo "starting verdaccio container ..."
docker run -itd --rm --net host --name verdaccio -e "VERDACCIO_PORT=5000"  -p 5000:5000  --mount 'type=volume,source=verdaccio-conf,destination=/verdaccio/conf' --mount 'type=volume,source=verdaccio-storage,destination=/verdaccio/storage' --mount 'type=volume,source=verdaccio-plugins,destination=/verdaccio/plugins' verdaccio/verdaccio
docker ps

停止脚本stop-verdaccio.sh

#!/bin/bash
echo "stoping verdaccio container ..."
docker stop verdaccio
docker ps

给脚本赋权:

chmod +x *.sh

启动 Verdaccio :

sh ./start-verdaccio.sh

4. 软链接卷到统一的目录

为了方便管理,将三个卷和启停脚本可以放一块

ln -s /var/lib/docker/volumes/verdaccio-conf/_data/ /home/verdaccio/conf
ln -s /var/lib/docker/volumes/verdaccio-plugins/_data/ /home/verdaccio/plugins
ln -s /var/lib/docker/volumes/verdaccio-storage/_data/ /home/verdaccio/storage

目录结构如下:
【前端-NPM私服】内网使用verdaccio搭建私有npm服务器-docker搭建verdaccio流程

PS:查看卷的位置可以使用命令

docker volume inspect verdaccio-conf

5. 配置Verdaccio

在刚刚创建的软链接目录/home/verdaccio/conf下,可以看到默认的config.yaml,现在可以做一些配置更改:

# 包含所有包的目录的路径
storage: /verdaccio/storage/data
# 包含插件的目录路径
plugins: /verdaccio/plugins

# 完整的webui配置查看 https://verdaccio.org/docs/webui
web:
  enable: true
  title: npm仓库
  logo: https://lichong.work/logo
  favicon: https://lichong.work/logo
  # 主题色
  primary_color: '#8794AF'
  # gravatar头像支持
  gravatar: true
  # 包默认的排序方式
  sort_packages: asc
  # 默认用户界面转换为暗黑主题
  darkMode: false
  # html缓存
  html_cache: false
  # 默认显示所有功能
  login: true
  # 是否显示右上角verdaccio项目的相关信息
  showInfo: false
  # 是否显示右上角设置
  showSettings: true
  # 结合 darkMode 可以切换主题
  showThemeSwitch: true
  # 是否显示页脚
  showFooter: false
  # 是否可以搜索
  showSearch: true
  # 是否展示包的原始清单
  showRaw: true
  # 是否可以下载压缩包
  showDownloadTarball: true
  #  HTML tags injected after manifest <scripts/>
  # scriptsBodyAfter:
  #    - '<script type="text/javascript" src="https://my.company.com/customJS.min.js"></script>'
  #  HTML tags injected before ends </head>
  #  metaScripts:
  #    - '<script type="text/javascript" src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script>'
  #    - '<script type="text/javascript" src="https://browser.sentry-cdn.com/5.15.5/bundle.min.js"></script>'
  #    - '<meta name="robots" content="noindex" />'
  #  HTML tags injected first child at <body/>
  #  bodyBefore:
  #    - '<div id="myId">html before webpack scripts</div>'
  #  Public path for template manifest scripts (only manifest)
  #  publicPath: http://somedomain.org/

# 认证相关完整配置查看 https://verdaccio.org/docs/configuration#authentication
auth:
  htpasswd:
    file: /verdaccio/storage/htpasswd
    # Maximum amount of users allowed to register, defaults to "+infinity".
    # You can set this to -1 to disable registration.
    # max_users: 1000
    # Hash algorithm, possible options are: "bcrypt", "md5", "sha1", "crypt".
    # algorithm: bcrypt # by default is crypt, but is recommended use bcrypt for new installations
    # Rounds number for "bcrypt", will be ignored for other algorithms.
    # rounds: 10

# 上游链路完整配置查看 https://verdaccio.org/docs/configuration#uplinks
uplinks:
  npmjs:
    url: https://registry.npmjs.org/
  npmmirror:
    url: https://registry.npmmirror.com/

# 了解如何保护包查看 https://verdaccio.org/docs/protect-your-dependencies/
# packages完整配置查看 https://verdaccio.org/docs/configuration#packages
packages:
  '@*/*':
    access: $all
    publish: $authenticated
    unpublish: $authenticated
    proxy: npmmirror
    
  '**':
    # 可以指定用户名/组名(取决于使用的身份验证插件)和三个关键字:“$all”、“$anonymous”、“$authenticated”

    # 允许所有用户(包括未经身份验证的用户)阅读和发布所有包
    access: $all
    # 允许所有已知用户发布/发布包
    publish: $authenticated
    unpublish: $authenticated
    # 如果包在本地找不到,将请求到“npmmirror”代理去查找
    proxy: npmmirror

# To improve your security configuration and  avoid dependency confusion
# consider removing the proxy property for private packages
# https://verdaccio.org/docs/best#remove-proxy-to-increase-security-at-private-packages

# https://verdaccio.org/docs/configuration#server
# You can specify HTTP/1.1 server keep alive timeout in seconds for incoming connections.
# A value of 0 makes the http server behave similarly to Node.js versions prior to 8.0.0, which did not have a keep-alive timeout.
# WORKAROUND: Through given configuration you can workaround following issue https://github.com/verdaccio/verdaccio/issues/301. Set to 0 in case 60 is not enough.
server:
  keepAliveTimeout: 60
  # Allow `req.ip` to resolve properly when Verdaccio is behind a proxy or load-balancer
  # See: https://expressjs.com/en/guide/behind-proxies.html
  # trustProxy: '127.0.0.1'

# https://verdaccio.org/docs/configuration#offline-publish
# publish:
#   allow_offline: false

# https://verdaccio.org/docs/configuration#url-prefix
# url_prefix: /verdaccio/
# VERDACCIO_PUBLIC_URL='https://somedomain.org';
# url_prefix: '/my_prefix'
# // url -> https://somedomain.org/my_prefix/
# VERDACCIO_PUBLIC_URL='https://somedomain.org';
# url_prefix: '/'
# // url -> https://somedomain.org/
# VERDACCIO_PUBLIC_URL='https://somedomain.org/first_prefix';
# url_prefix: '/second_prefix'
# // url -> https://somedomain.org/second_prefix/'

# https://verdaccio.org/docs/configuration#security
# security:
#   api:
#     legacy: true
#     jwt:
#       sign:
#         expiresIn: 29d
#       verify:
#         someProp: [value]
#    web:
#      sign:
#        expiresIn: 1h # 1 hour by default
#      verify:
#         someProp: [value]

# https://verdaccio.org/docs/configuration#user-rate-limit
# userRateLimit:
#   windowMs: 50000
#   max: 1000

# https://verdaccio.org/docs/configuration#max-body-size
# max_body_size: 10mb

# https://verdaccio.org/docs/configuration#listen-port
# listen:
# - localhost:4873            # default value
# - http://localhost:4873     # same thing
# - 0.0.0.0:4873              # listen on all addresses (INADDR_ANY)
# - https://example.org:4873  # if you want to use https
# - "[::1]:4873"                # ipv6
# - unix:/tmp/verdaccio.sock    # unix socket

# The HTTPS configuration is useful if you do not consider use a HTTP Proxy
# https://verdaccio.org/docs/configuration#https
# https:
#   key: ./path/verdaccio-key.pem
#   cert: ./path/verdaccio-cert.pem
#   ca: ./path/verdaccio-csr.pem

# https://verdaccio.org/docs/configuration#proxy
# http_proxy: http://something.local/
# https_proxy: https://something.local/

# webhook通知完整配置查看 https://verdaccio.org/docs/configuration#notifications
# notify:
#   method: POST
#   headers: [{ "Content-Type": "application/json" }]
#   endpoint: https://usagge.hipchat.com/v2/room/3729485/notification?auth_token=mySecretToken
#   content: '{"color":"green","message":"New package published: * {{ name }}*","notify":true,"message_format":"text"}'

middlewares:
  audit:
    enabled: true

# https://verdaccio.org/docs/logger
# log settings
logs: { type: stdout, format: pretty, level: http }
#experiments:
#  # support for npm token command
#  token: false
#  # enable tarball URL redirect for hosting tarball with a different server, the tarball_url_redirect can be a template string
#  tarball_url_redirect: 'https://mycdn.com/verdaccio/${packageName}/${filename}'
#  # the tarball_url_redirect can be a function, takes packageName and filename and returns the url, when working with a js configuration file
#  tarball_url_redirect(packageName, filename) {
#    const signedUrl = // generate a signed url
#    return signedUrl;
#  }

# 国际化配置
i18n:
  web: zh-CN

配置完成后重启 Verdaccio 即可生效

文章已收录至https://lichong.work,转载请注明原文链接。
ps:欢迎关注公众号“Fun肆编程”或添加我的私人微信交流经验🤝

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~往期精选🪶~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

【Docker】入门教程-基本概念解读
【前端-React Native】移动端原生开发整合React Native Elements教程-安卓示例
【前端-开发环境】使用NVM实现不同nodejs版本的自由切换(NVM完整安装使用手册)
【前端-NPM私服】内网使用verdaccio搭建私有npm服务器
【前端-IE兼容】Win10和Win11使用Edge调试前端兼容IE6、IE7、IE8、IE9、IE10、IE11问题
【前端-工程化】React项目工程化记录-内置项目活文档(老项目升级优化-集成Hosky/ESLint/Prettier-升级Webpack/Babel/NodeSass/React)
【工具-TWRP-frp-Termux】旧手机暴改成免费云服务器-MIUI刷TWRP安装magisk获取root
【工具-Shell脚本】java程序产品包模板-linux和windows通用shell启动停止脚本(无需系统安装Java运行环境)
【工具-Nginx】从入门安装到高可用集群搭建
【工具-Nginx】Nginx高性能通用配置文件-注释版-支持防刷限流、可控高并发、HTTP2、防XSS、Gzip、OCSP Stapling、负载、SSL
【工具-WireShark】网络HTTP抓包使用教程
【后端-maven打包】通过profile标签解决同时打jar包 war包需求
【架构-DDD】使用领域驱动设计-互联网未来架构设计之道(一)
【后端-SpringCache】基于Spring Cache封装一个能够批量操作的Redis缓存记录下踩坑历程(pipeline或mget封装)
【后端-SkyWalking】SkyWalking前后端开发环境搭建详细教程步骤-6.x/7.x/8.x版本通用-插件二次开发利器(一)
【后端-Quartz】Springboot整合Quartz支持集群环境-设计业务与框架分离及实现定时任务调度

✨欢迎为耿直少年点赞、关注、收藏!!!

👇👇👇文章来源地址https://www.toymoban.com/news/detail-436106.html

到了这里,关于【前端-NPM私服】内网使用verdaccio搭建私有npm服务器-docker搭建verdaccio流程的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包赞助服务器费用

相关文章

  • 使用 Verdaccio 私有化 npm 源指南

    使用 Verdaccio 私有化 npm 源指南

    使用 Verdaccio 私有化 npm 源指南 介绍 什么是 Verdaccio 为什么选择 Verdaccio 部署 Verdaccio Nodejs 部署 全局 局部 Docker 部署 云服务商一键部署 注册用户 发布私有 npm 包 管理 npm 包 项目使用私有源 全量切换 部分切换 结尾 源代码链接 在日常的工作开发中,我们常常会遇到这样的场景

    2024年04月15日
    浏览(22)
  • 内网npm私有仓库搭建以及使用教程

    内网npm私有仓库搭建以及使用教程

    前端团队沉淀一套通用的UI库、工具类、脚手架,不允许在公网发布,内网npm私有库搭建需求应运而生。如何在内网环境搭建npm私有仓库并使用?主角登场了 —— Verdaccio。 接下来我来教大家使用 verdaccio 在内网环境中搭建npm私有仓库。 为了避免因为基础环境不一致而产生意

    2024年02月03日
    浏览(25)
  • 前端工程化 搭建私有组件库 组件从开发到发布私有npm仓库的全过程

    前端工程化 搭建私有组件库 组件从开发到发布私有npm仓库的全过程

    前言 基于Vue3.0 + TS的组件从开发组件库到发布私有npm仓库的全过程 环境 这里列出本文所使用的环境版本 vue 3.0 vue/cli 4.5.9 nodeJs 14.15.1 npm 6.14.8 vue --version @vue/cli 4.5.9 npm -v 6.14.8 node -v v14.15.1 步骤 创建项目 使用 vue-cli 创建一个 vue3 项目,假设项目名为 avatar-ui-vue vue create avatar-u

    2024年02月02日
    浏览(480)
  • 使用verdaccio搭建私有组件库

    最近公司需要根据现有的公用组件搭建一套私有组件库,方便其他项目使用,然后经过一系列尝试和走了许多坑,终于搭建成功了,这里记录下搭建步骤,希望对你有些帮助。 由于公司组件库越来越多,导致每次去基础库里面cv组件特别麻烦,特别是还有这些组件有一些其他

    2024年02月03日
    浏览(15)
  • 【npm】npm私有库的使用-绑定

    【npm】npm私有库的使用-绑定

    输入基本信息 验证 收一次性验证码 登录 全局绑定了其他的私有库 若要在专门发包的项目中,发包到自己的私有库,需要在项目文件夹中创建一个 .npmrc 文件 创建文件 可以直接在项目目录下输入 touch .npmrc 创建文件 文件内容 登录 文件建好后,当前文件夹下的npm库已经独立

    2024年02月07日
    浏览(8)
  • npm 上传私服如何配置

    要将npm包上传到私有仓库,需要进行以下配置: 1. 安装和配置npm 首先,需要安装npm并配置好npm的环境变量。可以在终端中输入以下命令检查npm是否已经安装: 如果npm已经安装,会显示npm的版本号。如果没有安装,可以到npm官网下载安装包进行安装。 2. 创建私有仓库 特别提

    2024年02月06日
    浏览(7)
  • node.js+NPM包管理器+Webpack打包工具+前端项目搭建

    node.js+NPM包管理器+Webpack打包工具+前端项目搭建

    javascript运行环境(无需依赖html文件) BFF,服务于前端的后端 官网下载安装,node -v查看是否安装成功 ①、创建一个01.js文件 ②、通过CMD命令执行(或者通过工具的集成终端) node 01.js 如果出现权限原因,可以通过管理员方式打开工具 ③、通过浏览器访问http://127.0.0.1:8888 如

    2024年02月07日
    浏览(24)
  • 【前端框架】NPM概述及使用简介

    npm之于Node,就像pip之于Python,gem之于Ruby,composer之于PHP。 npm是Node官方提供的包管理工具,他已经成了Node包的标准发布平台,用于Node包的发布、传播、依赖控制。npm提供了命令行工具,使你可以方便地下载、安装、升级、删除包,也可以让你作为开发者发布并维护包。 npm是随

    2024年02月03日
    浏览(8)
  • npm私有源配置

    npm私有源配置

    Nexus 是 Sonatype 公司发布的一款仓库(Repository)管理软件,常用来搭建 Maven 私服,所以也有人将 Nexus 称为“Maven仓库管理器”。 Maven 私服其实并不是 Maven 的核心概念,它仅仅是一种衍生出来的特殊的仓库,但这并不代表它不重要,相反由于私服具有降低中央仓库负荷、节省

    2024年02月03日
    浏览(8)
  • npm发布包至私有仓库

    npm发布包至私有仓库

    前提:使用verdaccio在服务器搭建好了私有仓库 修改package.json中的相关信息后 登录至私服查看 在项目的.npmrc中添加私有包源 如果是流水线部署,不方便修改配置,可以在构建脚本中修改

    2024年04月15日
    浏览(9)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包