Docs
Next.js

Next.js

安装并配置 Next.js。

创建项目

运行 init 命令创建新的 Next.js 项目或设置现有项目:

npx shadcn@latest init

配置 components.json

配置 components.json 时会问你几个问题:

Which style would you like to use? › New York
Which color would you like to use as base color? › Zinc
Do you want to use CSS variables for colors? › no / yes

就这样

现在你可以开始为你的项目添加组件了。

npx shadcn@latest add button

执行上面的命令后会将 Button 组件添加到项目中。然后你就可以像这样导入(import)它了:

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