Vite

npmpnpmyarnbun
npx farsiui@latest init -t vite
Copy

npmpnpmyarnbun
npx farsiui@latest init -t vite --monorepo
Copy

npmpnpmyarnbun
npx farsiui@latest add card
Copy

npmpnpmyarnbun
npx farsiui@latest add card -c apps/web
Copy

Copyimport {
  Card,
  CardContent,
  CardDescription,
  CardHeader,
  CardTitle,
} from "@/components/ui/card"
 
function App() {
  return (
    <Card className="max-w-sm">
      <CardHeader>
        <CardTitle>نمای کلی پروژه</CardTitle>
        <CardDescription>
          پیشرفت و فعالیت‌های اخیر اپلیکیشن Vite خود را دنبال کنید.
        </CardDescription>
      </CardHeader>
      <CardContent>
        سیستم طراحی شما آماده است. ساخت کامپوننت بعدی را شروع کنید.
      </CardContent>
    </Card>
  )
}
 
export default App

npmpnpmyarnbun
npm create vite@latest
Copy

npmpnpmyarnbun
npm install tailwindcss @tailwindcss/vite
Copy

Copy@import "tailwindcss";

Copy{
  "files": [],
  "references": [
    {
      "path": "./tsconfig.app.json"
    },
    {
      "path": "./tsconfig.node.json"
    }
  ],
  "compilerOptions": {
    "baseUrl": ".",
    "paths": {
      "@/*": ["./src/*"]
    }
  }
}

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

npmpnpmyarnbun
npm install -D @types/node
Copy

Copyimport path from "path"
import tailwindcss from "@tailwindcss/vite"
import react from "@vitejs/plugin-react"
import { defineConfig } from "vite"
 
// https://vite.dev/config/
export default defineConfig({
  plugins: [react(), tailwindcss()],
  resolve: {
    alias: {
      "@": path.resolve(__dirname, "./src"),
    },
  },
})

npmpnpmyarnbun
npx farsiui@latest init
Copy

npmpnpmyarnbun
npx farsiui@latest add button
Copy

Copyimport { Button } from "@/components/ui/button"
 
function App() {
  return (
    <div className="flex min-h-svh flex-col items-center justify-center">
      <Button>کلیک کنید</Button>
    </div>
  )
}
 
export default App