This article is only technical verification, recording, communication, not for anyone. Please forgive me if I have offended you. In this paper, starting from https://vsnail.cn/static/doc/blog/verdaccio.html

background

At present, there are more and more front-end projects of the project team and the company, and the division of business system is more and more refined. Then, the problems of how to extract, maintain and manage public components and services between front-end projects become more and more prominent. Therefore, NPM private server is built to manage public components and services in the form of packages and release them in the form of version numbers, which can effectively manage public components and services within the company and project team. At the same time, through the permission setting, can also effectively protect the company’s achievements from being leaked. In addition, the speed of this step depends on the network and third-party images because the front-end needs to pull third-party packages again each time it is packaged. NPM private server can set the cache, after the first third party package pull, the subsequent pull will be directly from NPM private server, this will greatly improve the packaging compilation speed.

Why verdaccio

There are mainly several ways to build enterprise NPM private server online:

  1. Payment options:
  • MyGet
  • NPM Org
  1. Free options:
  • DIY NPM
  • GitIt is also an option inpackage.jsonSpecified in thegitThe warehouseURLOk, but it’s a little bit awkward. One, it makespackage.jsonIt’s not elegant. Number two, whengitWarehouse forprivateWhen you needHTTPSorSSHCredentials, and usually we don’t have access to each team.
  • Sinopia
  • verdaccio

The options are DIY NPM, Sinopia and Verdaccio, excluding payment. In terms of community activity, Verdaccio was basically chosen. Verdaccio is a very simple open source NPM service.

Set up

  1. Find an appropriate place to download and install nodeJS, such as /usr/local/lib

    Install wGET (skip this step for those already installed)

    
yum install -y wget;

Copy the code

    Download:

    Wget HTTP: / / https://npm.taobao.org/mirrors/node/v12.14.0/node-v12.14.0-linux-x64.tar.xzCopy the code

    Extract:

    The tar XVF - node - v10.6.0 - Linux - x64. Tar. Xz;Copy the code

    Rename the installation directory:

    Node - mv v10.6.0 - Linux - x64 nodejs;Copy the code

    Establish soft connection:

    
ln -s /usr/local/lib/nodejs/bin/npm /usr/local/bin/
ln -s /usr/local/lib/nodejs/bin/node /usr/local/bin/

Copy the code

Run the node -v and NPM -v commands to check whether the installation is successful

Global installation verdaccio:

npm i verdaccio -g;
Copy the code

Install pM2 globally, which is used to guard node processes:

npm i pm2 -g;
Copy the code

Pm2 Starts the service

pm2 start verdaccio;
Copy the code

Then, visit http://server IP address. If the following page is displayed, the installation is successful.

Pm2 start ** / Pm2 reload ** // Restart; Pm2 logs *** //

Verdaccio use

Verdaccio allows anyone to create an account, and by default any development registered with Verdaccio has publish permission if the verdaccio configuration file config.yaml is not configured. Here’s an example:

The following uses the http://1.1.1.1:4873 service as an example. Note that the configuration file must be modified for other machines to access it. Refer to the advanced configuration

  1. Add a user:NPM adduser - registry at http://1.1.1.1:4873
  2. Add source information to the project you want to add to the service. Create a new project in the project root directory.npmrcFile, add the following
Registry = http://1.1.1.1:4873Copy the code

  1. Set the version in package.json and publish NPM

  2. Look at http://1.1.1.1:4873. A list is available on the cashback website

The advanced

It’s definitely not going to meet our needs. We need controllable permissions (add users, request, publish, revoke packages) and a configurable UI. Take a look at the configuration provided by Verdaccio

verdaccioThe default configuration

Storage:./storage # websiteconfig: / root/config/verdaccio/logo PNG # site navigation bar background primary_color: "# 3894 ff" auth # access configuration: # built-in htpasswd permissions plug-in htpasswd: /htpasswd # Maximum number of users. -1 indicates that registration cannot be performed at random. Max_users: - 1 # external package management warehouse address uplinks: NPMJS: url: https://registry.npmjs.org/ packages: '@ * / *' : access: $all the publish: $authenticated proxy: npmjs '**': proxy: npmjs logs: - {type: stdout, format: pretty, level: http}Copy the code

Extranet access configuration

The following configuration must be added to config.yaml if the extranet needs access

listen: 0.0. 0. 0: 4873
Copy the code

User management

With the default configuration, we can pass

NPM adduser - registry = http://1.1.1.1:4873Copy the code

So you can register users at will. But for corporate private servers, this is usually not desirable. Therefore, we can disable random registration of users through the following configuration.

auth:
  htpasswd:
    file: ./htpasswd
    max_users: - 1
Copy the code

So the question is, how do we add users after that? There are two ways:

  1. Manual editing./htpasswdFile.
  2. Use third-party plug-ins to add users in the form of commands.

npm install sinopia-adduser -g

Copy the code

To install the plug-in, run the following command in the./htpasswd directory


sinopia-adduser

Copy the code

permissions

Verdaccio introduces the htpasswd plug-in by default. However, the plugin can only set permissions from the user’s perspective. In practice, we usually want to set permissions by grouping.

Since third-party permissions components have permissions servers, we just want to have the ability to set permissions by group. So I wrote a simplegroup permission plug-in verdaccio-simplegroup. Making address: https://github.com/btshj-snail/snail-verdaccio-group.


npm install verdaccio-simplegroup -g

Copy the code

In the config.yaml configuration file, add the corresponding configuration

auth:
  htpasswd:
    file: ./htpasswd
    max_users: - 1
  simplegroup:
    admin_group: Jack Lucy
    base_group: Jack

packages:
  '@company/*':
    access: $authenticated
    publish: admin_group
    unpublish: admin_group
    proxy: npmjs

  '@base/*':
    access: $authenticated
    publish: base_group
    unpublish: base_group
    proxy: npmjs
  '* *':
    access: $all
    publish:
    unpublish:
    proxy: npmjs
Copy the code

Ok, add the above configuration, the basic can reach the degree of use. As a joke, the default site UI provided by Verdaccio is really a bit low and offers few configurable places. I also wanted to write a plugin for the website, but considering the recent time, I’ll do it later.

reference

  1. NPM Private Server architecture – Verdaccio solution and best practices
  2. YAML Quick Start
  3. Verdaccio builds private NPM
  4. verdaccio