Skip to main content

Web User Interface

Uplinks

Verdaccio has a web user interface to display only the private packages and can be customised to your liking.

web:
enable: true
title: Verdaccio
logo: http://somedomain/somelogo.png
primary_color: "#4b5e40"
gravatar: true | false
scope: "@scope"
sort_packages: asc | desc
darkMode: false
favicon: http://somedomain/favicon.ico | /path/favicon.ico
rateLimit:
windowMs: 50000
max: 1000
pkgManagers:
- npm
- yarn
- pnpm
login: true
scriptsBodyAfter:
- '<script type="text/javascript" src="https://my.company.com/customJS.min.js"></script>'
metaScripts:
- '<script type="text/javascript" src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script>'
- '<script type="text/javascript" src="https://browser.sentry-cdn.com/5.15.5/bundle.min.js"></script>'
- '<meta name="robots" content="noindex" />'
scriptsbodyBefore:
- '<div id="myId">html before webpack scripts</div>'
html_cache: true
showInfo: true
showSettings: true
# In combination with darkMode you can force specific theme
showThemeSwitch: true
showFooter: true
showSearch: true
showDownloadTarball: true
showRaw: true

All access restrictions defined to protect your packages will also apply to the Web Interface.

The primary_color and scope must be wrapped by quotes: eg: ('#000000' or "#000000")

The primary_color must be a valid hex representation.

Internationalization

Since v4.5.0, there are translations available.

i18n:
web: en-US

⚠️ Only the enabled languages on this file are available, you can contribute by adding new more languages. The default one is en-US

Configuration

PropertyTypeRequiredExampleSupportDescription
enablebooleanNotrue/falseallallow to display the web interface
titlestringNoVerdaccioallHTML head title description (if is not define set "Verdaccio" by default).
gravatarbooleanNotrue>v4Gravatars will be generated under the hood if this property is enabled
sort_packages[asc,desc]Noasc>v4By default private packages are sorted by ascending
logostringNo/local/path/to/my/logo.png http://my.logo.domain/logo.pngalla URI where logo is located (header logo)
primary_colorstringNo"#4b5e40">4The primary color to use throughout the UI (header, etc)
scopestringNo@myscope>v3.xIf you're using this registry for a specific module scope, specify that scope to set it in the webui instructions header
darkModebooleanNofalse>=v4.6.0This mode is an special theme for those want to live in the dark side
faviconstringNofalse>=v5.0.1Display a custom favicon, can be local resource or valid url
rateLimitobjectNouse userRateLimit configuration>=v5.4.0Increase or decrease rate limit, by default is 5k request every 2 minutes, only limit web api endpoints, the CSS, JS, etcc are ingnored
pkgManagersnpm, pnpm or yarnNonpm>=v5.5.0Allow customise which package managers on the side bar and registry information dialog are visible
loginbooleanNotrue or false>=v5.5.0Allow disable login on the UI (also include web endpoints).
scriptsBodyAfterstring[]Noany list of strings>=5.0.0inject scripts after the tag
metaScriptsstring[]Noany list of strings>=5.0.0inject scripts inside
scriptsbodyBeforestring[]Noany list of strings>=5.0.0inject scripts before the
html_cachebooleanNotrue>=v5.9.0whether the html cache is enabled, default true
showInfobooleanNotrue>=v5.10.0display the info button on the header
showSettingsbooleanNotrue>=v5.10.0display the settings button on the header
showThemeSwitchbooleanNotrue>=v5.10.0display the theme switch button on the header
showFooterbooleanNotrue>=v5.10.0allow hide footer
showSearchbooleanNotrue>=v5.10.0allow hide search component
showDownloadTarballbooleanNotrue>=v5.10.0allow hide download button on the sidebar
showRawbooleanNotrue>=v5.10.0allow hide manifest button on the sidebar (experimental feature)

The recommended logo size is 40x40 pixels.

The darkMode can be enabled via UI and is persisted in the browser local storage. If you combine showThemeSwitch: false with darkMode users will be forced to use an specific theme. Furthermore, also void primary_color and dark cannot be customized.