Laravel Breeze & PrimeVue

A starter kit using Laravel Breeze with the Intertia.js Vue option, utilizing PrimeVue v4 components.

Installation

Clone the repo (or download the zip)

git clone https://github.com/connorabbas/primevue-auth-starter.git

Step into the project directory
```
cd ./primevue-auth-starter
```
Install the framework and other packages
```
composer install
```

Setup .env file

Windows

copy .env.example .env

Unix/Linux/MacOS

cp .env.example .env

Generate the app key
```
php artisan key:generate
```
Migrate database tables (after .env and database related config setup)
```
php artisan migrate
```
Install npm packages
```
npm install
```
Start the Vite dev server
```
npm run dev
```

Theme

This starter kit provides a light/dark mode and custom theme functionality provided by the powerful PrimeVue theming system, using styled mode and custom design token values.

The starting point for customizing your theme will be the resources\js\Modules\theme-preset.mjs module file. To quickly change the look and feel of your theme, swap the primary values with a different set of colors, change the surface colorScheme values (slate, gray, neutral, etc.), or completely change the preset theme (Aura used by default).

Please reference the PrimeVue Styled Mode Docs to fully understand how this system work, and how to further customize your theme to make it your own.

PrimeVue v4 w/ Tailwind CSS

If you have used a previous version of this project using PrimeVue v3, you'll know that Tailwind was removed in favor of PrimeFlex. With v4 however, the PrimeTek team has officially suggested Moving from PrimeFlex to Tailwind CSS.

For this reason, Tailwind has been added back into the project and is utilized with the tailwindcss-primeui plugin. CSS layers have also been implemented so the Tailwind utilities can override the PrimeVue component styling when needed.

alexandre-da-costa/primevue-breeze-inertia

Laravel Breeze & PrimeVue

Installation

Theme

PrimeVue v4 w/ Tailwind CSS