TanStack Start

为 TanStack Start 安装并配置 shadcn/ui。

开始一个新项目？ 使用 shadcn/create 来获取一个完全配置的 TanStack Start 应用，包含自定义主题、Base UI 或 Radix，以及图标库。

🌐 Create project

运行以下命令以使用 shadcn/ui 创建一个新的 TanStack Start 项目：

🌐 Run the following command to create a new TanStack Start project with shadcn/ui:


pnpm dlx shadcn@latest init -t tanstack

对于单仓库项目，请使用 --monorepo 标志：


pnpm dlx shadcn@latest init -t tanstack --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:

app/routes/index.tsx

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

On This Page