0
Fork 0
mirror of https://github.com/verdaccio/verdaccio.git synced 2024-12-16 21:56:25 -05:00
verdaccio/website/versioned_docs/version-5.x/plugins.md
Juan Picado 3d158a195a
chore(website): plugin search ui (#3539)
* chore: plugin search ui

chore: progress

chore: format code

chore: progress

chore: @verdaccio-ui/copy-clipboard

chore: search finish

* chore: ui-components

* Update ToolList.tsx

* xss protection

* Update static-data.yml

* Update AddonCard.tsx
2022-12-25 18:48:18 +01:00

8.3 KiB

id title
plugins Plugins

Verdaccio is a pluggable application. It can be extended in many ways, either new authentication methods, adding endpoints or using a custom storage.

There are 5 types of plugins:

If you are interested to develop your own plugin, read the development section.

Usage

Installation

$> npm install --global verdaccio-activedirectory

verdaccio as a sinopia fork it has backward compatibility with plugins that are compatible with sinopia@1.4.0. In such case the installation is the same.

$> npm install --global sinopia-memory

Configuration

Open the config.yaml file and update the auth section as follows:

The default configuration looks like this, due we use a build-in htpasswd plugin by default that you can disable just commenting out the following lines.

Naming convention

Since version 2.0.0 until version plugins must start with the following convention:

  • sinopia-xxx (deprecated and will be removed on 6.x.x)
  • verdaccio-xxx

After version 5.12.0 scoped plugins are supported, for example:

auth:
  '@my-org/auth-awesome-plugin':
    foo: some value
    bar: another value
store:
  '@my-org/store-awesome-plugin':
    foo: some value
    bar: another value
middleware:
  '@my-org/middleware-awesome-plugin':
    foo: some value
    bar: another value

Authentication Configuration

auth:
  htpasswd:
    file: ./htpasswd
    # max_users: 1000

and replacing them with (in case you decide to use a ldap plugin.

auth:
  activedirectory:
    url: 'ldap://10.0.100.1'
    baseDN: 'dc=sample,dc=local'
    domainSuffix: 'sample.local'

Multiple Authentication plugins

This is technically possible, making the plugin order important, as the credentials will be resolved in order.

auth:
  htpasswd:
    file: ./htpasswd
    #max_users: 1000
  activedirectory:
    url: 'ldap://10.0.100.1'
    baseDN: 'dc=sample,dc=local'
    domainSuffix: 'sample.local'

Middleware Configuration

This is an example how to set up a middleware plugin. All middleware plugins must be defined in the middlewares namespace.

middlewares:
  audit:
    enabled: true

You might follow the audit middle plugin as base example.

Storage Configuration

This is an example how to set up a storage plugin. All storage plugins must be defined in the store namespace.

store:
  memory:
    limit: 1000

Theme Configuration

Verdaccio allows to replace the User Interface with a custom one, we call it theme. By default, uses @verdaccio/ui-theme that comes built-in, but, you can use something different installing your own plugin.


$> npm install --global verdaccio-theme-dark

The plugin name prefix must start with verdaccio-theme, otherwise the plugin won't load.

You can load only one theme at a time and pass through options if you need it.

theme:
  dark:
    option1: foo
    option2: bar

Theme plugin development

Since v.5.0.0

If you have a custom UI plugin for the them you will need to adapt your build to the new requirements.

The previous version you only need to return a function with a string and the path of the directory.

const path = require('path');

module.exports = () => {
  return path.join(__dirname, 'static');
};

The module must return an object and the index.html is ignored since support dynamic rendering, eg:

  staticPath: '/somePath/node_modules/verdaccio-theme-custom/static',
  manifest: {
    'main.js': '-/static/main.c21a97b1dbe8456a9c76.js',
    'runtime.js': '-/static/runtime.c21a97b1dbe8456a9c76.js',
    'NotFound.js': '-/static/NotFound.c21a97b1dbe8456a9c76.js',
    'Provider.js': '-/static/Provider.c21a97b1dbe8456a9c76.js',
    'Version.js': '-/static/Version.c21a97b1dbe8456a9c76.js',
    'Home.js': '-/static/Home.c21a97b1dbe8456a9c76.js',
    'Versions.js': '-/static/Versions.c21a97b1dbe8456a9c76.js',
    'UpLinks.js': '-/static/UpLinks.c21a97b1dbe8456a9c76.js',
    'Dependencies.js': '-/static/Dependencies.c21a97b1dbe8456a9c76.js',
    'Engines.js': '-/static/Engines.c21a97b1dbe8456a9c76.js',
    'Dist.js': '-/static/Dist.c21a97b1dbe8456a9c76.js',
    'Install.js': '-/static/Install.c21a97b1dbe8456a9c76.js',
    'Repository.js': '-/static/Repository.c21a97b1dbe8456a9c76.js',
    'vendors.js': '-/static/vendors.c21a97b1dbe8456a9c76.js',
    '718.c21a97b1dbe8456a9c76.js': '-/static/718.c21a97b1dbe8456a9c76.js',
    '238.c21a97b1dbe8456a9c76.js': '-/static/238.c21a97b1dbe8456a9c76.js',
    '73.c21a97b1dbe8456a9c76.js': '-/static/73.c21a97b1dbe8456a9c76.js'
  },
  manifestFiles: { js: [ 'runtime.js', 'vendors.js', 'main.js' ] }
  • staticPath: is the same data returned in Verdaccio 4.
  • manifest: A webpack manifest object.
  • manifestFiles: A object with one property js and the array (order matters) of the manifest id to be loaded in the template dynamically.

Manifest and Webpack

Verdaccio uses the webpack manifest object to render the html dynamically, in combination with the manifestFiles the application understand what to render.

Currently only support js but if you also need css, we are open to discuss it and further improvements.

const { WebpackManifestPlugin } = require('webpack-manifest-plugin');

  plugins: [
    ...
    new WebpackManifestPlugin({
      removeKeyHash: true,
    }),
    ...
  ],

Legacy plugins

Sinopia Plugins

If you are relying on any sinopia plugin, remember are deprecated and might no work in the future.

All sinopia plugins should be compatible with all future verdaccio versions. Anyhow, we encourage contributors to migrate them to the modern verdaccio API and using the prefix as verdaccio-xx-name.