VUI is an open source UI library providing customizable web components for Vue.js.
- 3 types of web components: Html, UI, and layout, written in a way to provide simple implementation and easy customization. 24 components are available in the current release.
- Styles and layouts allow easy CSS overriding (no inline definitions, no messy !importants, ...).
- Compatible with server rendering ( SSR ).
- Integrates fontawesome-free Icons library.
- Provides documentation and tests.
Online documentation and live demo are available here
Package and releases are available on NPM
Install first the library:
npm install -s @e-xode/vuiIn your Vue application:
import { createApp } from 'vue'
import { createI18n } from 'vue-i18n'
import App from './App.vue'
import vui from '@e-xode/vui'
const main = createApp(App)
main.use(vui)
main.use(new createI18n({
legacy: false,
locale: 'en',
messages: { en: [] }
}))Notes:
- The current version of VUI works only with vue-i18n and option legacy = false (translations are components isolated)
- Version of node currently supported: 21
@import "@e-xode/vui/dist/style.css";@import "@fortawesome/fontawesome-free/css/all.css";
@font-face {
font-family: 'Font Awesome 5 Brands';
font-style: normal;
font-weight: 400;
src:
url('@fortawesome/fontawesome-free/webfonts/fa-brands-400.woff2') format('woff2'),
url('@fortawesome/fontawesome-free/webfonts/fa-brands-400.ttf') format('truetype')
}
@font-face {
font-family: 'Font Awesome 5 Regular';
font-style: normal;
font-weight: 400;
src:
url('@fortawesome/fontawesome-free/webfonts/fa-regular-400.woff2') format('woff2'),
url('@fortawesome/fontawesome-free/webfonts/fa-regular-400.ttf') format('truetype')
}
@font-face {
font-family: 'Font Awesome 5 Solid';
font-style: normal;
font-weight: 900;
src:
url('@fortawesome/fontawesome-free/webfonts/fa-solid-900.woff2') format('woff2'),
url('@fortawesome/fontawesome-free/webfonts/fa-solid-900.ttf') format('truetype')
}copy .env_sample .envOptional: edit .env file content and update values according to your config
docker-compose upnpm install
npm run dev