WL Shared UI Components

This library provides a set of UI components used across all applications within the WL ecosystem.

Adding @wunschlachen/wl-shared-components to a Nuxt Project

Step 1: Install the Library

To add WL components, use Node's package manager:

npm install @wunschlachen/wl-shared-components

Step 2: Create a Vuetify Plugin File

Create a new file named wlSharedComponents.js inside your plugins folder, and add the following code to define the Vuetify plugin:

// plugins/wlSharedComponents.js
import { defineNuxtPlugin } from "#app";
import vuetify from "@wunschlachen/wl-shared-components/src/plugins/vuetify";

export default defineNuxtPlugin((nuxtApp) => {
  nuxtApp.vueApp.use(vuetify);
});

Step 3: Update Nuxt Configuration

In your nuxt.config.js, add the following configurations:

Add vuetify and @wunschlachen/wl-shared-components to the build.transpile section. Register the Vuetify plugin by adding it to the plugins array.

export default defineNuxtConfig({
  build: {
    transpile: ["vuetify", "@wunschlachen/wl-shared-components"],
  },
});

Development

Running Storybook To begin development and launch Storybook, execute:

npm install
npm run storybook

Contributing

Pull requests are welcome! For major changes, please open an issue first to discuss proposed changes.

Ensure that any necessary tests are updated to maintain project integrity.