Vexip UI Nuxt

Features

🏆 Automatically import components, plugins, directives, icons and their styles on demand

Quick Setup

Add @vexip-ui/nuxt dependency to your project:

# Using pnpmpnpm i -D @vexip-ui/nuxt# Using yarnyarn add -D @vexip-ui/nuxt

If you want to control the version of Vexip UI, you need to add vexip-ui dependency to your project too:

# Using pnpmpnpm i -D vexip-ui# Using yarnyarn add -D vexip-ui

Add @vexip-ui/nuxt to the modules section of nuxt.config.ts:

export default defineNuxtConfig({  modules: [    '@vexip-ui/nuxt'  ],  vexipUI: {    // Your module options  }})

That's it! You can now use Vexip UI in your Nuxt app:

<template>  <VButton :icon="IUser" @click="handleClick">    Button  </VButton>  <VIcon>    <ISackDollar></ISackDollar>  </VIcon></template><script setup lang="ts">function handleClick() {  VMessage.success('Success!')}</script>

Module Options

Note that each option has default value, you only need to specify when changing it.

import type { FilterPattern } from '@rollup/pluginutils'export interface ModuleOptions {  /**   * Include files that need to automatically resolve   *   * @default   * [   *   /\.vue$/,   *   /\.vue\?vue/,   *   /\.vue\?v=/,   *   /\.((c|m)?j|t)sx?$/   * ]   */  include: FilterPattern,  /**   * Include files that don't need to automatically resolve   *   * @default   * [   *   /[\\/]node_modules[\\/]/,   *   /[\\/]\.git[\\/]/,   *   /[\\/]\.nuxt[\\/]/   * ]   */  exclude: FilterPattern,  /**   * Import css or sass styles with components   *   * @default 'css'   */  importStyle: boolean | 'css' | 'sass',  /**   * Import the dark theme preset styles   *   * @default false   */  importDarkTheme: boolean,  /**   * Prefix for name of components   *   * @default 'V'   */  prefix: string,  /**   * Auto import for directives   *   * @default true   */  directives: boolean,  /**   * Resolve icon components from '@vexip-ui/icons'   *   * @default true   */  resolveIcon: boolean,  /**   * Prefix for name of icon components, same to `prefix` if undefined or null   *   * @default ''   */  iconPrefix: string}

Contributors

Thanks for all their contributions!

Development

# Install dependenciespnpm install# Generate type stubspnpm run dev:prepare# Develop with the playgroundpnpm run dev# Build the playgroundpnpm run dev:build# Run ESLintpnpm run lint# Run Vitestpnpm run testpnpm run test:watch

License

All in MIT license.