【前端工程化】Verdaccio搭建本地npm仓库

背景

Verdaccio 是一个 Node.js创建的轻量的私有npm proxy registry

我们在开发npm包的时候,经常需要验证发包流程,或者开发的npm包仅局限于公司内部使用时,就可以借助Verdaccio搭建一个npm仓库,搭建完之后,只要更改npm install的源地址,指向该仓库地址,就可以实现上述提出的两个功能。

# 例如
npm set registry http://localhost:4873# 或者
npm install lodash --registry http://localhost:4873

实践

# 全局安装
npm i verdaccio -g# 运行
verdaccio# 这时候会打印出verdaccio安装的位置信息
# 比如 
# info --- config file  - \verdaccio\config.yaml
# info --- using htpasswd file: \verdaccio\htpasswd
# info --- plugin successfully loaded: verdaccio-htpasswd
# info --- plugin successfully loaded: verdaccio-audit
# warn --- http address - http://localhost:4873/ - verdaccio/5.25.0

打开http://localhost:4873/:

在这里插入图片描述

  • verdaccio\config.yaml 是仓库的配置文件
  • verdaccio\htpasswd 当用户注册之后,会记录用户信息
  • storage所有上传的包都会保存在这里~

关于verdaccio\config.yaml这里说几个比较常用的配置项:

# 设置用户上传包的存放目录
storage: ./storage
#  插件目录
plugins: ./plugins# 前端页面的配置,可以设置如下参数,详见https://verdaccio.org/docs/webui
web:title: Verdaccio# comment out to disable gravatar support# gravatar: false# by default packages are ordercer ascendant (asc|desc)# sort_packages: asc# convert your UI to the dark side# darkMode: true# html_cache: true# by default all features are displayed# login: true# showInfo: true# showSettings: true# In combination with darkMode you can force specific theme# showThemeSwitch: true# showFooter: true# 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: ./htpasswd# Maximum amount of users allowed to register, defaults to "+inf".# 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#  设置上游匹配,主要用于包匹配不到时,系统该往哪里去找这个包
uplinks:npmjs:url: https://registry.npmjs.org/# packages 包相关配置,用于设置包的上传、下载、访问的权限控制
# https://verdaccio.org/docs/protect-your-dependencies/
# https://verdaccio.org/docs/configuration#packages
packages:'@*/*':# scoped packagesaccess: $allpublish: $authenticatedunpublish: $authenticatedproxy: npmjs'**':# $all 所有登录、未登录者都可以访问# $authenticated 只有登录者可以访问# $anonymous 未登录可以访问# a、b、v等 指定用户名、只有该用户可以访问access: $all# 发布权和取消发布权publish: $authenticatedunpublish: $authenticated# if package is not available locally, proxy requests to 'npmjs' registryproxy: npmjs# 服务器的相关配置
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'# 端口号配置
# 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# https的配置
# https://verdaccio.org/docs/configuration#https
# https:
#   key: ./path/verdaccio-key.pem
#   cert: ./path/verdaccio-cert.pem
#   ca: ./path/verdaccio-csr.pemmiddlewares:audit:enabled: true# https://verdaccio.org/docs/logger
# log settings
log: { type: stdout, format: pretty, level: http }# 设置语言
# i18n
#   web: en-US

接下来先注册一下账号

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

输入账号密码,之后再去http://localhost:4873/登录发现登录成功,且目录下面会生成htpasswd文件

这里推荐一个挺好用的工具:nrm,这样可以帮你随时切换源~

这样我们在本地开发完一个npm包之后,可以切换npm源成本地npm仓库,然后执行npm publish即可,即可将npm包发布到本地的npm仓库中~

参考

  • Verdaccio官网
  • nrm

如有错误,欢迎指出,感谢阅读~

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/512.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

【微服务】微服务架构设计

文章目录 背景一、流量入口Nginx二、网关三、业务组件四、服务注册中心五、缓存和分布式锁六、数据持久层七、结构型数据存储八、消息中间件九、日志收集十、任务调度中心十一、分布式对象存储 背景 当前&#xff0c;微服务架构在很多公司都已经落地实施了&#xff0c;下面用一…

C++学习 程序控制结构

程序控制结构 以某种顺序执行的一系列动作&#xff0c;用于解决某个问题。包括 顺序结构、选择结构、循环结构。 顺序结构 按照顺序正常执行。前几篇文章的代码都是顺序结构的体现。 选择结构 执行满足条件的语句。 if 结构&#xff1a;if (表达式){} 表达式为真则执行&…

python接口自动化(三)--如何设计接口测试用例(详解)

简介 上篇我们已经介绍了什么是接口测试和接口测试的意义。在开始接口测试之前&#xff0c;我们来想一下&#xff0c;如何进行接口测试的准备工作。或者说&#xff0c;接口测试的流程是什么&#xff1f;有些人就很好奇&#xff0c;接口测试要流程干嘛&#xff1f;不就是拿着接口…

【kubernetes系列】Kubernetes之pod、lable和annotation

本章节将继续分享关于kubernetes中的一些重要概念。 一、Pod Pod 是 Kubernetes 的最小工作单元。每个 Pod 包含一个或多个容器。Pod 中的容器会作为一个整体被 Master 调度到某个 Node 上运行。(可以把pod想象成豌豆荚&#xff0c;里面的豌豆就是容器&#xff0c;可以有一个…

C++多态

面向对象语言存在三大特性&#xff0c;即&#xff1a;继承&#xff0c;封装和多态。C这一门面向对象语言当然也具有如此的特性&#xff0c;并且对于其中的继承和封装&#xff08;类和对象&#xff09;&#xff0c;我们在之前的博客中已经有所讨论过了。于是&#xff0c;在本篇博…

Altium Designer 使用总结

文章目录 1.1 原理图模式下1.1.1 元件统一命名1.1.2 原理图右下方信息框更改1.1.3 快速复制元件1.1.4 查找元器件1.1.5 垂直、水平镜像翻转元件1.1.6 查找相同的网络标号 1.2 PCB模式下1.2.1 mil 与 mm之间的单位转换1.2.2 测量1.2.3 批量修改丝印层文字大小1.2.4 属性更改1.2.…

想要让视频素材格式快速调整转换的方法分享

有时候有些视频播放软件不支持播放某些格式的视频文件&#xff1f;那要怎么解决呢&#xff1f;换一个播放软件&#xff1f;不妨试试批量转换视频格式&#xff0c;简单的几步操作就能快速解决烦恼&#xff0c;跟着小编一起来看看具体的操作环节吧。 首先先进入“固乔科技”的官网…

Docker Compose基础与实战

一、是什么 Compose 项目是 Docker 官方的开源项目&#xff0c;负责实现对 Docker 容器集群的快速编排。 二、能做什么 Compose允许用户通过一个单独的docker-compose.yml模板文件&#xff08;YAML 格式&#xff09;来定义一组相关联的应用容器为一个项目&#xff08;project&…

前端web入门-CSS-day07

(创作不易&#xff0c;感谢有你&#xff0c;你的支持&#xff0c;就是我前行的最大动力&#xff0c;如果看完对你有帮助&#xff0c;请留下您的足迹&#xff09; 目录 定位 相对定位 绝对定位 定位居中 固定定位 堆叠层级 z-index 定位-总结 高级技巧 CSS 精灵 字…

将图像2D转换为3D--LeiaPix Converter

LeiaPix Converter是一款免费的在线图像处理工具&#xff0c;可帮助用户将2D图像实时转换为精美的3D光场图像。 它使用由Leia开发的专有算法&#xff0c;为照片、插画和艺术作品等2D图像添加深度和立体感&#xff0c;目前是完全免费的。 LeiaPix Converter 的特点 多格式转换…

【Spring Clound】Nacos高可用集群搭建与使用

文章目录 一、Nacos 简介二、Nacos 安装2.1、Nacos 环境依赖2.2、Nacos 服务端安装 三、Nacos 部署3.1、单实例部署3.2、 集群部署3.2.1、集群架构3.2.2、模拟部署 四、微服务集成Nacos4.1、依赖组件版本选型4.2、注册中心4.2.1、服务提供者4.2.2、服务消费者4.2.3、服务调用4.…

Linux上安装matlab

首先需要下载文件&#xff0c;微人大正版软件下载里有 然后直接点击&#xff0c;就可以就可以安装&#xff0c;不需要使用挂载命令&#xff0c;然后使用 ./install就可以进行安装了&#xff0c;这里记住是得登录自己的人大邮箱&#xff0c;否则无法激活&#xff0c;然后修改安…