What is Verdaccio?

Website: www.verdaccio.org/

A lightweight private npm proxy registry

A lightweight NPM central agent repository! Using node to achieve

Simply put, this is the NPM private deployment repository, similar to the official paid private repository of NPM.

Make of motivation

Why are we doing this? Is to move our company’s NPM private warehouse out of nexus.

We currently share nexus with the back end because Nexus also manages maven and all that!

NPM private warehouse independent, good follow-up to the whole company!!

Here we use Docker to deploy itself (using V4.6. x) to facilitate subsequent rolling updates.

Configuration files and module cache directories are mapped from the external directory, which is more flexible to maintain

Access from the Internet is through the Nginx proxy, and access from the Intranet cluster is authorized through the security group policy.

Note: Official Docker images are not used.

rendering

Generally speaking, it is more friendly to front-end staff, and a lot of information is intuitive. Dependencies, release repositories, code feedback, Node versions, and more


Pay attention to your points and posture

Verdaccio configuration is concentrated in a single configuration file, config.yaml

Basic Configuration (default language, LOGO replacement, sorting)

web:
  # WebUI is enabled as default, if you want disable it, just uncomment this line
  enable: true
  title: # The main body title entered on the homepage of the website
  logo: You can specify a remote connection image, comment it out and use the default
  # comment out to disable gravatar support
  gravatar: true
  # by default packages are ordercer ascendant (asc|desc)
  # sort_packages: sort asC packages
  # darkMode: true # darkMode
  # 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 The default is en-us, we will change the default to Chinese, this thing supports multiple languages
Copy the code

Account mechanism and authorization

We are used internally, so going to LDAP is inevitable.

Verdaccio supports the plugin mechanism, which we used here:

Verdaccio-ldap: this plugin basically satisfies account opening!

The authorization mechanism is also through the LDAP plug-in given a group,

You can use the authorization group to send and revoke the resource package.

Of course, it can also be specific to a user! As shown in figure

Upstream chain configuration

Because we currently have two clusters, it is impossible to build this thing and give up the previous one.

So how can resources from the previous private warehouse be accessed through this private warehouse,

How do I access NPM resources in extranet communities? Mainly configure uplinks to achieve.

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
Copy the code

Verdaccio Uplinks document

Package installation index resource order

We use this repository to install resources in order, is in order from top to bottom search!!

It is worth mentioning that: proxy is not necessary to proxy multiple public network sources at the same time, will be very slow!!!! Because will poll to find resources!!

packages:
  '@h3/*': If the package starts with @h3, it will be retrieved first
    access: $all # Who can access
    publish: linqh jira # Who can publish (can authorize individual users or groups, such as me and all users of jIRA in our case)
    unpublish: linqh # Someone can unpack!! The bag will be removed from the private store!! Instead of typing the deprecated flag as NPM does
    proxy: nexus-yunshu Uplinks supports multiple upstream links


  '* *': # final index is not very similar to the concept of routing,
    # 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 We first pull from the image source of Taobao, and then query our private package before nexus
                                                       
Copy the code

Verdaccio package access documents

Effect map field display

This is done by reading the standard fields of package.json,

Part of the code data desensitization!!!! My own name doesn’t matter ~~

Json with some comments, you can see

{"name": "test-ci", "version": "0.5.0", "description":" This is just a test package, including ci/ CD test, do not download!!" {"serve": "vue-cli-service serve", "build": "vue-cli-service build", "lint": {"serve": "vue-cli-service build", "lint": "vue-cli-service lint", "jk2dt": "jk2dt" }, "keywords": [# Keywords "test", "test-verdaccio", "CI "," CI/CD ", "demo", "example"], "author": "Linqunhe ", # authors" fizolcoding ": [# contributors {" name ":" XXX ", "email" : "XXXM"}, {" name ":" xx2 ", "email" : "[email protected]"}, {" name ":" xx3 ", "email" : "[email protected]"}], "dependencies" : {# core rely on "core - js" : "^ 3.6.5", "vue" : "^ 2.6.11"}, "devDependencies" : {# development rely on "@ 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 - the template", "- the 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": {# reference associated dependencies, not mandatory, missing will warning "@ h3 / antd - vue" : "> = 1.4.10", "lodash" : "> = 4.17.15", "vue" : "> = 2.6.11", "vue - the template - the compiler" : "> = 2.6.11"}, "bugs" : {# corresponding code repo issue "url" : "HTTXXXXK/issues", "email" : "CXXX}", "engines" : ">= 12.0.0", "NPM ": "^6.0.0"}, "repository": {# code repo "type": "Git ", "url": "httpxxxx-hook. Git"}, "publishConfig": {# publish domain: "registry": "http://xxx"}, "homepage": "httxxxxdy/test-ci-hook#readme", "license": "MIT" }Copy the code

Project resources Server installation error 500

For example: error: internal erver error

Please rule out the following three points in turn

  • Proxy upstream chain references each other, please keep it single!
  • Local cache exception
    • The installation area clears the cache firstnpm cache clear -fTo install
  • The ultimate rule (with caution)
    • Clear the module cache directory of Verdaccio so that all dependencies are resorted (private packages that have been published should be backed up)

Package release push to the spike group

Verdaccio Notifications document

Verdaccio supports webhook to push and send packet information (triggered when NPM publish)

parameter type mandatory support The default value describe
method string No all Request method POST or…
packagePattern string No all Matches which packages trigger the notification push hook when they are published
packagePatternFlags string No all Js regular flag bits, such as I, ignore case
headers array/object Yes all HTTP Headers, no need to say more
endpoint string Yes all Webhook sending endpoint
content string Yes all Can be roughly understood as HTTP body supportHandlebarexpression 
# Notice the indentation
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}}` "}} '


Copy the code

For example, nail support several formats, as long as you piece together the corresponding format can be normal push!!

conclusion

If there is something wrong, please leave a message and correct it in time. Thank you for reading!