Manual

Add tailwindcss

Configure Tailwind CSS: Setup Tailwind CSS

Configure path aliases

Add the baseUrl and paths properties to the compilerOptions section of the tsconfig.json file:

{
  "compilerOptions": {
    "baseUrl": ".",
    "paths": {
      "@/*": ["./*"]
    }
  }
}

Setup

Run the init command to setup uilabs in your project:

npx uilabs-cli init

npx uilabs-cli init -d

Configuration

You will be asked a few questions to configure uilabs.config.json:

? Would you like to use TypeScript? › no / yes (default)
? Configure the import alias for components: › @/components
? Would you like to install @uilabs/utils package? › no / yes (default)
? Are you using React Server Components? › no / yes (default)

Add components

You can now start adding components to your project.

npx uilabs-cli add [component-id]

The command above will add the component to your project in the directory you specified during the initialization.