Next.js

为 Next.js 安装和配置 shadcn/ui。

Starting a new project? Use shadcn/create for a fully configured Next.js app with custom themes, Base UI or Radix, and icon libraries.

运行 init 命令创建一个新的 Next.js 项目，或者设置一个现有项目：


pnpm dlx shadcn@latest init

选择 Next.js 项目或 Monorepo。

现在可以开始向项目中添加组件。


pnpm dlx shadcn@latest add button

上述命令会将 Button 组件添加到项目中。然后可以像这样导入它：

app/page.tsx

import { Button } from "@/components/ui/button"
 
export default function Home() {
  return (
    <div>
      <Button>点击我</Button>
    </div>
  )
}