0
Fork 0
mirror of https://github.com/verdaccio/verdaccio.git synced 2024-12-16 21:56:25 -05:00
verdaccio/.changeset/smart-apricots-kneel.md

80 lines
2.6 KiB
Markdown
Raw Normal View History

---
'@verdaccio/ui-theme': major
'@verdaccio/cli-standalone': major
'@verdaccio/web': 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.
```yaml
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
#### Related tickets
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