mirror of
https://github.com/shadcn-ui/ui.git
synced 2026-07-09 06:55:07 +00:00
57 lines
1.1 KiB
Plaintext
57 lines
1.1 KiB
Plaintext
---
|
||
title: Laravel
|
||
description: Install and configure Laravel with Inertia
|
||
---
|
||
|
||
<Steps>
|
||
|
||
### Create project
|
||
|
||
Start by creating a new Laravel project with Inertia and React using the laravel installer `laravel new my-app`:
|
||
|
||
```bash
|
||
laravel new my-app --typescript --breeze --stack=react --git --no-interaction
|
||
```
|
||
|
||
### Run the CLI
|
||
|
||
Run the `shadcn` init command to setup your project:
|
||
|
||
```bash
|
||
npx shadcn@latest init
|
||
```
|
||
|
||
### Configure components.json
|
||
|
||
You will be asked a few questions to configure `components.json`:
|
||
|
||
```txt showLineNumbers
|
||
Which style would you like to use?
|
||
Which color would you like to use as base color?
|
||
Do you want to use CSS variables for colors? › yes
|
||
```
|
||
|
||
### That's it
|
||
|
||
You can now start adding components to your project.
|
||
|
||
```bash
|
||
npx shadcn@latest add button
|
||
```
|
||
|
||
The command above will add the `Button` component to your project. You can then import it like this:
|
||
|
||
```tsx {1,6} showLineNumbers
|
||
import { Button } from "@/Components/ui/button"
|
||
|
||
export default function Home() {
|
||
return (
|
||
<div>
|
||
<Button>Click me</Button>
|
||
</div>
|
||
)
|
||
}
|
||
```
|
||
|
||
</Steps>
|