Vuelex

Vue 3 component library with accessible, themeable building blocks: forms, tables, overlays, rich text editors and more.

Note: Vuelex is in active development (0.x). APIs may change between minor versions.

Installation

npm install vuelex
# or
bun add vuelex

Vuelex requires Vue ^3.5.

Usage

Import components individually and include the base stylesheet:

import { createApp } from 'vue'
import App from './App.vue'
import 'vuelex/style'

createApp(App).mount('#app')

<script setup lang="ts">
import { Button, Accordion } from 'vuelex'
</script>

<template>
  <Button>Click me</Button>
</template>

Per-component styles can be imported on demand, e.g. vuelex/style/button.

Note: Vuelex currently publishes TypeScript/SCSS sources. Your bundler (Vite, Nuxt, etc.) compiles them as part of your app build.

Nuxt

export default defineNuxtConfig({
  modules: ['vuelex/nuxt'],
})

Vite plugin

import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import { vuelex } from 'vuelex/vite'

export default defineConfig({
  plugins: [
    vue(),
    vuelex(),
  ],
})

vuelex/vite auto-imports components/directives and injects vuelex/style by default.

Documentation

Component docs, examples and guides live in the repository.

License

MIT