Instalar shadcn en vite (javascript)

crear app

npm create vite@latest dummy -- --template react

cd dummy

npm i

agregar tailwind

npm install -D tailwindcss postcss autoprefixer

npx tailwindcss init -p

modificar src/index.css

@tailwind base;
@tailwind components;
@tailwind utilities;

modificar tailwind.config.js

/** @type {import('tailwindcss').Config} */
module.exports = {
  content: ["./index.html", "./src/**/*.{js,jsx}"],
  theme: {
    extend: {},
  },
  plugins: [],
}

crear jsconfig.json

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

modificar vite.config.js

import path from "path"
import react from "@vitejs/plugin-react"
import { defineConfig } from "vite"

export default defineConfig({
  plugins: [react()],
  resolve: {
    alias: {
      "@": path.resolve(__dirname, "./src"),
    },
  },
});

inicializar shadcn

npx shadcn@latest init

agregar componentes

npx shadcn@latest add button

utilizar componente

import { Button } from "./components/ui/button";

function App() {
  return (
    <div>
      <Button>Click me</Button>
    </div>
  )
};

export default App;

ejecutar app

npm run dev