Installation

    How to install dependencies and structure your app.

    add a compontent.json file in the root of your project with the following content:

    {
  "$schema": "https://ui.bastiencouder.com/schema.json",
  "framework": "react",
  "tailwind": {
    "config": "tailwind.config.js",
    "css": "styles/global.css",
    "cssVariables": true
  },
  "aliases": {
    "components": "@/components",
    "utils": "@/lib/utils",
    "ui": "@/components/ui",
    "lib": "@/lib",
    "hooks": "@/hooks",
  }
}

    Add helper functions

    import { clsx, type ClassValue } from "clsx";
import { twMerge } from "tailwind-merge";
 
export function cn(...inputs: ClassValue[]) {
  return twMerge(clsx(inputs));
}

    To configure import aliases, you can use the following jsconfig.json:

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