文档
Next.js
Next.js
为 Next.js 安装和配置 shadcn/ui。
注意: 以下指南适用于 Tailwind v4。如果您使用的是 Tailwind v3,请使用 shadcn@2.3.0
。
创建项目
运行 init
命令来创建一个新的 Next.js 项目或设置一个已有的项目
pnpm dlx shadcn@latest init
在 Next.js 项目或 Monorepo 之间选择。
添加组件
您现在可以开始向您的项目添加组件。
pnpm dlx shadcn@latest add button
上面的命令会将 Button
组件添加到您的项目中。然后您可以像这样导入它
import { Button } from "@/components/ui/button"
export default function Home() {
return (
<div>
<Button>Click me</Button>
</div>
)
}