文档
React Router
React Router
安装并配置 shadcn/ui 以用于 React Router。
创建项目
pnpm create react-router@latest my-app
运行 CLI
运行 shadcn-ui
init 命令来设置您的项目
pnpm dlx shadcn@latest init
添加组件
您现在可以开始向您的项目添加组件。
pnpm dlx shadcn@latest add button
上面的命令会将 Button
组件添加到您的项目。然后您可以像这样导入它
app/routes/home.tsx
import { Button } from "~/components/ui/button"
import type { Route } from "./+types/home"
export function meta({}: Route.MetaArgs) {
return [
{ title: "New React Router App" },
{ name: "description", content: "Welcome to React Router!" },
]
}
export default function Home() {
return (
<div className="flex flex-col items-center justify-center min-h-svh">
<Button>Click me</Button>
</div>
)
}