组件
要开始一个新项目吗? 使用 shadcn/create 来获取一个完全配置的 Astro 应用,包含自定义主题、Base UI 或 Radix,以及图标库。
创建项目
🌐 Create project
首先创建一个新的 Astro 项目:
🌐 Start by creating a new Astro project:
pnpm dlx shadcn@latest init -t astro
对于单仓库项目,请使用 --monorepo 标志:
pnpm dlx shadcn@latest init -t astro --monorepo
添加组件
🌐 Add Components
你现在可以开始向你的项目添加组件。
🌐 You can now start adding components to your project.
pnpm dlx shadcn@latest add button
上面的命令将会把 Button 组件添加到你的项目中。然后你可以这样导入它:
🌐 The command above will add the Button component to your project. You can then import it like this:
---
import { Button } from "@/components/ui/button"
---
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width" />
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
<meta name="generator" content={Astro.generator} />
<title>Astro + TailwindCSS</title>
</head>
<body>
<div class="grid place-items-center h-screen content-center">
<Button>Button</Button>
</div>
</body>
</html>