Laravel

为 Laravel 安装并配置 shadcn/ui

正在开启新项目？ 使用 shadcn/create 快速创建一个完全配置好的 Laravel 应用，它包含自定义主题、Base UI 或 Radix，以及图标库。

创建项目

首先，使用 Laravel 安装程序创建一个带有 Inertia 和 React 的新 Laravel 项目

laravel new my-app --react

运行 shadcn/ui CLI

运行 init 命令以在你的 Laravel 项目中配置 shadcn/ui


pnpm dlx shadcn@latest init --force

如果询问是否覆盖现有组件，请回答 y 以继续。

添加组件

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


pnpm dlx shadcn@latest add switch

上述命令会将 Switch 组件添加到 resources/js/components/ui/switch.tsx。随后你就可以像这样导入它

resources/js/pages/index.tsx

import { Switch } from "@/components/ui/switch"
 
const MyPage = () => {
  return (
    <div>
      <Switch />
    </div>
  )
}
 
export default MyPage

Vite React Router

本页内容

创建项目运行 shadcn/ui CLI 添加组件

在 Vercel 上部署你的 shadcn/ui 应用

OpenAI、Sonos、Adobe 等公司的信任之选。

Vercel 提供工具和基础设施，以规模化部署应用和功能。