1
0
mirror of https://github.com/verdaccio/verdaccio.git synced 2024-11-08 23:25:51 +01:00
verdaccio/.changeset/smart-apricots-kneel.md
Juan Picado 558d78f32a feat: flexible user interface generator (#2070)
* feat: flexible template generator and manifest

* chore: add changeset

* chore: restore dep

* chore: add docs

* chore: update snapshots

* chore: update docker examples for v5

* chore: refactor web module

* chore: format

* chore: refactor web api endpoints

* test: add test for user login web

* chore: refactor endpoints

* chore: fix merge

* chore: fix merge

* Update ci.yml

* chore: test

* chore: add static

* chore: update script

* chore: fix e2e

* chore: fix method

* docs: update v5 relative docker example

* chore: update html render

* chore: update style

* Update .prettierignore

* chore: update changeset

* chore: use pnpm6 on run test

temporary ci

* chore: drop node 16 for pnpm 6

* chore: update ci

* chore: update ci

* chore: update ci

* chore: update ci

* chore: remove circle ci

* chore: better url prefix handling

* chore: format code

* chore: remove test node 10

* docs: add docker v5 relative revers proxy example

* chore: use base html tag

* chore: update test
2021-04-09 17:54:38 +02:00

2.6 KiB

@verdaccio/ui-theme @verdaccio/cli-standalone @verdaccio/web
major major major

feat: flexible user interface generator

breaking change

The UI does not provide a pre-generated index.html, instead the server generates the body of the web application based in few parameters:

  • Webpack manifest
  • User configuration details

It allows inject html tags, javascript and new CSS to make the page even more flexible.

Web new properties for dynamic template

The new set of properties are made in order allow inject html and JavaScript scripts within the template. This might be useful for scenarios like Google Analytics scripts or custom html in any part of the body.

  • metaScripts: html injected before close the head element.
  • scriptsBodyAfter: html injected before close the body element.
  • bodyAfter: html injected after verdaccio JS scripts.
web:
  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" />'
  bodyBefore:
    - '<div id="myId">html before webpack scripts</div>'
  bodyAfter:
    - '<div id="myId">html after webpack scripts</div>'

UI plugin changes

  • index.html is not longer used, template is generated based on manifest.json generated by webpack.
  • Plugin must export:
    • the manifest file.
    • the manifest files: matcher (array of id that generates required scripts to run the ui)
    • static path: The absolute path where the files are located in node_modules
exports.staticPath = path.join(__dirname, 'static');
exports.manifest = require('./static/manifest.json');
exports.manifestFiles = {
  js: ['runtime.js', 'vendors.js', 'main.js'],
  css: [],
  ico: 'favicon.ico',
};
  • Remove font files
  • CSS is inline on JS (this will help with #2046)

Docker v5 Examples

  • Move all current examples to v4 folder
  • Remove any v3 example
  • Create v5 folder with Nginx Example

https://github.com/verdaccio/verdaccio/issues/1523 https://github.com/verdaccio/verdaccio/issues/1297 https://github.com/verdaccio/verdaccio/issues/1593 https://github.com/verdaccio/verdaccio/discussions/1539 https://github.com/verdaccio/website/issues/264 https://github.com/verdaccio/verdaccio/issues/1565 https://github.com/verdaccio/verdaccio/issues/1251 https://github.com/verdaccio/verdaccio/issues/2029 https://github.com/verdaccio/docker-examples/issues/29