@genexus/vite-plugin-nova
v0.1.0
Published
Vite plugin for Nova Design System
Keywords
Readme
@genexus/vite-plugin-nova
Vite plugin for the Nova Design System. Handles CSS bundle hashing, asset serving in dev mode, and distribution builds automatically.
Installation
npm install @genexus/vite-plugin-nova @genexus/nova-build --save-devUsage
// vite.config.ts
import { defineConfig } from "vite";
import { nova } from "@genexus/vite-plugin-nova";
export default defineConfig({
plugins: [nova()]
});What it does
| Hook | Action |
| -------------------- | ------------------------------------------------------------------------------------------ |
| configureServer | Creates a middleware to serve Nova CSS, fonts, and icons from a temporal build folder |
| transformIndexHtml | Inlines critical CSS, preloads bundles, and injects setBundleMapping() for hash resolution |
| writeBundle | Copies processed CSS + assets to the Vite output directory |
Options
nova({
// Customize where assets are served/placed in the distribution build
assetsPaths: {
cssPath: "/assets/css/", // default
fontsPath: "/assets/fonts/", // default
iconsPath: "/assets/icons/" // default
},
// Disable hashing for specific bundles (not recommended)
avoidHash: {
"base/base": false // default: all bundles are hashed
},
// CSS bundles to inline as <style> tags in <head>
// Default: { "base/base": true, "resets/box-sizing": true }
cssInline: {
"base/base": true,
"resets/box-sizing": true
},
// CSS bundles to preload as <link> tags
// Default: { "base/icons": { position: "body-end", fetchPriority: "low" } }
cssPreload: {
"base/icons": {
position: "body-end", // "head" | "body-start" | "body-end"
fetchPriority: "low" // "auto" | "high" | "low"
}
}
});How CSS hashing works
- The plugin reads all CSS bundles from
@genexus/nova/dist/bundles/css/ - Replaces relative asset paths (
./assets/fonts/,./assets/icons/) with configured absolute paths - Generates an MD5 content hash (16 characters) for each CSS file
- Writes hashed files to
node_modules/.genexus/nova/assets/css/ - Generates a
bundle-to-hash-mappings.tsfile for runtime bundle resolution - Injects the mapping into the HTML via
setBundleMapping()sogetBundles()resolves hashed filenames
Requirements
@genexus/novamust be installed as a dependency@genexus/nova-buildmust be installed (peer dependency)
License
Apache-2.0
