Install daisyUI for Laravel
How to install Tailwind CSS and daisyUI in a Laravel project
1. Create a new Laravel project
Install PHP, Composer and Laravel Installer according to the official Laravel documentation
Create a new Laravel project
Terminal
laravel new my-app
cd my-app2. Install Tailwind CSS and daisyUI
Terminal
npm install tailwindcss@latest @tailwindcss/vite@latest daisyui@betaAdd Tailwind CSS to Vite config
vite.config.js
import { defineConfig } from 'vite';
import tailwindcss from '@tailwindcss/vite';
import laravel from 'laravel-vite-plugin';
export default defineConfig({
plugins: [
tailwindcss(),
laravel({
input: ['resources/css/app.css', 'resources/js/app.js'],
refresh: true,
}),
],
});Put Tailwind CSS and daisyUI in your CSS file (and remove old styles)
Add the template files you want as source. Learn more about Tailwind CSS @source directive.
resources/css/app.css
@import "tailwindcss";
@source "../views";
@plugin "daisyui";3. Run your project
Run your Laravel project
Terminal
php artisan serveAnd on another terminal tab, run Vite
Terminal
npm run devNow you can use daisyUI class names!
Do you have a question? Ask on GitHub or Discord server
Do you like daisyUI? Post about it!
Support daisyUI's development: Open Collective
