Verdaccio私仓搭建的一些注意点和姿势

verdaccio是什么?

官网: www.verdaccio.org/

A lightweight private npm proxy registry

一个轻量级的npm中心代理仓库!采用node实现的

简单点说,就是npm私有部署仓库,类似npm官方付费的私有仓.

搞的动机

为什么会搞这个? 是想把我们公司的npm私有仓从nexus迁移出来.

我们目前和后端共用nexus,因为nexus也能管理maven这些!

npm私有仓库独立出来,后续好推向整个公司!!

我们这里采用docker自己部署(用的是v4.6.x),方便后续滚动更新.

配置文件及模块缓存目录是从外部映射进去,维护比较弹性

外网访问是通过nginx代理,内网集群是通过安全组策略授权.

注意: 非采用官方docker镜像.

效果图

总体来说对前端人员比较友好,很多信息很直观. 包括依赖,发布仓库,代码反馈,node版本等等

注意点及姿势

verdaccio配置主要集中在一个配置文件, config.yaml

基础配置(默认语言,logo替换,排序)

web:
  # WebUI is enabled as default, if you want disable it, just uncomment this line
  enable: true
  title: #网站首页进入的正文标题
  logo: #这里可以给定一个远程连接的图片,注释掉就采用默认的
  # comment out to disable gravatar support
  gravatar: true
  # by default packages are ordercer ascendant (asc|desc)
  # sort_packages: asc  # 包的排序
  # darkMode: true # 黑暗模式
  # scope: "@scope"

# translate your registry, api i18n not available yet
i18n:
# list of the available translations https://github.com/verdaccio/ui/tree/master/i18n/translations
  web: zh-CN # 默认是en-US,我们改为默认中文,这个东东支持多语言

账号机制及授权

我们是公司内部使用,所以走ldap是必然的.

verdaccio支持插件机制,这里我们用了这个插件:

verdaccio-ldap : 这个插件基本满足账号的打通!

授权机制也是通过ldap插件给定某个组,

对应的资源发包和撤回权限采用授权组即可.

当然也可以特定到某个用户!如图

上游链的配置

因为我们目前有两个集群,不可能搭了这个东东,就放弃之前的.

那之前的私有仓资源如何可以通过这个私有仓访问,

外网社区的npm资源如何接入呢?主要配置uplinks来实现.

uplinks:
  npmjs:
    url: https://registry.npmjs.org/
    timeout: 10s
  yarn:
    url: https://registry.yarnpkg.com/
    timeout: 10s
  taobao:
    url: https://registry.npm.taobao.org/
    timeout: 10s

Verdaccio Uplinks 文档

包安装索引资源顺序

我们通过这个仓库安装资源有顺序的,是依次之上往下检索!!

值得一提的是: proxy没必要同时代理多个公网的源,会非常慢!!!!因为会轮询去找资源!!

packages:
  '@h3/*': # 若是@h3开头的包优先检索
    access: $all #谁可以访问
    publish: linqh jira # 谁可以发布(可以授权个人用户或者组,比如我们这里是我还有我们jira的所有用户)
    unpublish: linqh # 谁可以撤包!!就会把包从私有仓下架!!!而非npm那样只打deprecated标记位
    proxy: nexus-yunshu # 这里就是关联上游链了,uplinks,支持多个上游链


  '**': # 最终索引的地方,是不是很像路由的概念,
    # allow all users (including non-authenticated users) to read and
    # publish all packages
    #
    # you can specify usernames/groupnames (depending on your auth plugin)
    # and three keywords: "$all", "$anonymous", "$authenticated"
    access: $all

    # allow all known users to publish/publish packagesnonymous
    # (anyone can register by default, remember?)
    publish: $authenticated
    unpublish: $authenticated

    # if package is not available locally, proxy requests to 'npmjs' registry
    proxy: taobao  nexus-yunshu # 公网包我们优先从淘宝镜像源上拉取,之后查询我们nexus之前的私有包

Verdaccio 包访问文档

效果图字段展示

主要是读取package.json的标准字段来实现的,

代码的部分数据做了脱敏!!!!我自己的名字就无所谓了~~

json里面加了些注释,可以瞅瞅

{
  "name": "test-ci",
  "version": "0.5.0",
  "description":"这只是一个测试发包的例子,包括用来测试ci/cd的,请勿下载使用!!!", # 包描述
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "lint": "vue-cli-service lint",
    "jk2dt": "jk2dt"
  },
  "keywords": [ # 给别人检索的关键字
    "test",
    "test-verdaccio",
    "ci",
    "ci/cd",
    "demo",
    "example"
  ],
  "author": "linqunhe", # 作者
  "contributors": [ # 贡献者
    {
      "name": "xxx",
      "email": "xxxm"
    },
    {
      "name": "xx2",
      "email": "xx2@xxx.com"
    },
    {
      "name": "xx3",
      "email": "xx@xx.com"
    }
  ],
  "dependencies": { # 核心依赖
    "core-js": "^3.6.5",
    "vue": "^2.6.11"
  },
  "devDependencies": { # 开发依赖
    "@h3/jenkins-2-dingtalk": "^1.7.10",
    "@vue/cli-plugin-babel": "~4.4.0",
    "@vue/cli-plugin-eslint": "~4.4.0",
    "@vue/cli-service": "~4.4.0",
    "babel-eslint": "^10.1.0",
    "eslint": "^6.7.2",
    "eslint-plugin-vue": "^6.2.2",
    "vue-template-compiler": "^2.6.11"
  },
  "eslintConfig": {
    "root": true,
    "env": {
      "node": true
    },
    "extends": [
      "plugin:vue/essential",
      "eslint:recommended"
    ],
    "parserOptions": {
      "parser": "babel-eslint"
    },
    "rules": {}
  },
  "browserslist": [
    "> 1%",
    "last 2 versions",
    "not dead"
  ],
  "peerDependencies": { # 引用的关联依赖,不会强制安装,缺失会警告
    "@h3/antd-vue": ">=1.4.10",
    "lodash": ">=4.17.15",
    "vue": ">=2.6.11",
    "vue-template-compiler": ">=2.6.11"
  },
  "bugs": { # 对应code  repo的issue
    "url": "httxxxxk/issues",
    "email":"cxxx"
  },
  "engines": { # 可以告知该报依赖什么node版本乃至什么版本的npm
    "node": ">= 12.0.0",
    "npm" : "^6.0.0"
  },
  "repository": { # code repo
    "type": "git",
    "url": "httpxxxx-hook.git"
  },
  "publishConfig": { # 指定发布域,就是指向私有仓
    "registry": "http://xxx"
  },
  "homepage": "httxxxxdy/test-ci-hook#readme", 
  "license": "MIT"
}

项目资源安装服务端错误500

比如: error: internal erver error

请依次排除以下三点

代理的上游链互相引用,请保持单一!
本地缓存异常
- 安装区域先清空缓存 npm cache clear -f 再安装
终极大法(慎用)
- 清空verdaccio的模块缓存目录,这样所有依赖会重新梳理(已经发布的私有包注意备份)

包发布推送到钉钉群

Verdaccio Notifications文档

Verdaccio支持webhook方式推送发包信息(在npm publish的时候触发)

参数	类型	必填	支持	描述
method	string	No	all	请求方法post还是...
packagePattern	string	No	all	匹配在哪些包发布的时候触发消息推送钩子
packagePatternFlags	string	No	all	js 正则标志位，如i忽略大小写
headers	array/object	Yes	all	http headers,不用多说
endpoint	string	Yes	all	webhook发送端点
content	string	Yes	all	可以出粗暴的理解为http的body,支持 Handlebar 表达式

# 注意缩进
notify:
  'test-dingtalk':
     method: POST
     headers: [{'Content-Type': 'application/json;charset=utf-8'}]
     endpoint: https://oapi.dingtalk.com/robot/send?access_token=xx1e1
     content: '{ "msgtype": "text","at": { "isAtAll": false }, "text": {"content":"New package published: `{{ name }}{{#each versions}} v{{version}}{{/each}}`"}}'

比如钉钉支持的几种格式,你只要拼凑对应的格式就能正常推送!!

总结

有不对之处请留言,会及时修正,谢谢阅读!