Recently, when I finally had time to do something other than business requirements, I put component library requirements on my agenda.

For some components that are not suitable for open source, I thought of building a private NPM repository.

So I went to consult an experienced boss, who smiled and said: Verdaccio.

What is this?

I searched github, and as I expected, it was an open source library with 11.8kstar (github.com/verdaccio/v…

All in all, this is a tool for building an NPM repository.

Out of curiosity, I went to Wikipedia to look up this word:

Verdaccio is an Italian word meaning a mixture of black, white and yellow pigments, and its color is light gray or light yellow, soft greenish-brown.

The word originates from mural painting, which is a kind of “ground color” in mural painting, on which other colors can be better rendered. Verdaccio’s name comes from Sinopia (also an open source NPM repository builder), which means the red earth or rust color of the mural background.

The reason for not adopting Sinopia is simple, the project is old, the last update was 6 years ago…

Don’t say a word. Just masturbate.

Installation operation

Verdaccio has two installation methods, one is direct installation, the other is docker image.

1.1 Direct Installation

npm install --global verdaccio@6-next --registry https://registry.verdaccio.org/
Copy the code

After the installation is complete, you can see a file named verdacio in the /node/bin directory. This file actually points to the build/lib/cli.js package in verdaccio.

// cli.js
#!/usr/bin/env node
"use strict";
if (process.getuid && process.getuid() === 0) {
  process.emitWarning(`Verdaccio doesn't need superuser privileges. don't run it under root`);
} // eslint-disable-next-line import/order
const logger = require('./logger');
logger.setup(null, {
  logStart: false
}); // default setup
require('./cli/cli');
process.on('uncaughtException'.function (err) {
  logger.logger.fatal({
    err: err
  }, 'uncaught exception, please report this\n@{err.stack}');
  process.exit(255);
});
Copy the code
  • #! /usr/bin/env nodeUse Node to execute the script file.
  • process.getuid()The user ID of the running process is returned. If the value is 0, it will prompt you not to run the process under root (root user ID =0).
  • loggerIs a logging module under the Verdaccio project. When the process catches an exception, it updates the log and terminates the current process.
  • require('./cli/cli')The cli file will be loaded, which will perform some initialization operations, such as reading. Yaml or.yml configuration file information, setting the corresponding page title, icon, etc., creating the Node server and listening for the configured port (such as default 4873), etc. After a series of complex operations, We can run Verdaccio directly and access the corresponding page using the port number.

1.2 Direct Operation

Running verdaccio.

verdaccio
Copy the code

Run successfully!If the installation is local, open a browser and typehttp://localhost:4873, you can see the page:

Note:

  1. If it is installed on a server, add it to the configuration fileListen: 0.0.0.0:4873(see the configuration file below), and then access the IP address online through port number 4873.
  2. If you use a cloud server, pay attention to the following firewall rules:

1.3 PM2 Daemon Running in the Background

If you run Verdaccio directly from the command line, you will not be able to access the page after the process is closed, so it is recommended to use the pm2 daemon, which allows Verdaccio to run in the background.

Pm2 official website: pm2. Keymetrics. IO /

Running verdaccio.

pm2 start verdaccio
Copy the code

Stop verdaccio:

pm2 stop verdaccio
Copy the code

2.1 docker installation

docker pull verdaccio/verdaccio:nightly-master
Copy the code

2.2 docker run

docker run -it --rm --name verdaccio -p 4873:4873 verdaccio/verdaccio
Copy the code

The effect is the same as direct installation, open the link in the browser to access the page.

Access configuration

Setup is done, but how do you control access?

It is mentioned in the official document that Verdaccio uses a plug-in named htpasswd to configure permissions. The default configuration file is config.yaml under the verdaccio installation directory.

Official document has detailed instructions of configuration items: verdaccio.org/docs/en/con…

Here is my configuration file:

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: -1 uplinks: npmjs: url: https://registry.npmjs.org/ packages: '@*/*': # scoped packages access: $authenticated publish: $authenticated unpublish: $authenticated proxy: npmjs '**': access: $authenticated publish: $authenticated unpublish: $authenticated proxy: npmjs server: keepAliveTimeout: 60 middlewares: audit: enabled: true logs: { type: Stdout, format: pretty, level: HTTP} listen: 0.0.0.0:4873Copy the code

Description of configuration items:

  • The access, publish, or unpublish values are as follows:
    • $all: any user;
    • $anonymous: Only anonymous users;
    • $authenticated: Only authorized users.
  • Max_users :-1, users are not allowed to register. If NPM adduser is executed, 409 errors are reported. Set the user to -1 after the user is registered locally.
  • Listen: 0.0.0.0:4873:0.0.0.0:4873:0.0.0.0:4873:0.0.0.0:4873:0.0.0.0:4873:0.0.0.0:4873:0.0.0.0:4873

After modifying the configuration file, restart verdaccio to take effect:

verdaccio -c config.yaml
Copy the code

At this point, only users logged in to Verdaccio can operate on packages in the warehouse.

NPM login: NPM adduser –registry http://xxx.xx.xxx:4873

Publish package: NPM publish –registry http://xxx.xx.xxx:4873

Unpublish: NPM unpublish package name –registry http://xxx.xx.xxx:4873

Download package: NPM install -registry http://xx.xx.xxx:4873

Set as the mirror source

npm set registry http://xx.xx.xxx:4873/
Copy the code

If verdaccio cannot find the corresponding package in the repository, verdaccio will try to pull the corresponding package from the NPM repository. After the pull is successful, the package will be cached in the storage directory (compressed package format).