installation-vite.md

Vite Setup

1. Install the dependencies

npm install @react-zero-ui/core

npm install @tailwindcss/postcss

---

🔧 Setup

Vite

2. Add the plugin to your vite.config.ts

// vite.config.*
import zeroUI from '@react-zero-ui/core/vite';
import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react';
import tailwindCss from '@tailwindcss/postcss';

export default defineConfig({
	// ❗️Remove the default `tailwindcss()` plugin - and pass it into the `zeroUI` plugin
	plugins: [zeroUI({ tailwind: tailwindCss }), react()],
});

3. Import Tailwind CSS

// global.css
@import "tailwindcss";

Thats it.

The plugin will add the data-* attributes to the body tag (no FOUC) and the CSS will be injected and transformed by tailwind.