Menu
I installed and configured laravel breeze and blade according to the documentation given by laravel. By default it uses Vite but somehow @vite directive is not working in my project and I don't know what I miss.
tailwind.config.js
const defaultTheme = require('tailwindcss/defaultTheme');
/** @type {import('tailwindcss').Config} */
module.exports = {
content: [
'./vendor/laravel/framework/src/Illuminate/Pagination/resources/views/*.blade.php',
'./storage/framework/views/*.php',
'./resources/views/**/*.blade.php',
],
theme: {
extend: {
fontFamily: {
sans: ['Nunito', ...defaultTheme.fontFamily.sans],
},
},
},
plugins: [require('@tailwindcss/forms')],
};
vite.config.js
import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';
export default defineConfig({
plugins: [
laravel([
'resources/css/app.css',
'resources/js/app.js',
]),
]
});
The vite is compiling properly my js and css assets:
I then created a test blade template with @vite directive:
<!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="csrf-token" content="{{ csrf_token() }}">
<title>{{ config('app.name', 'Laravel') }}</title>
<!-- Fonts -->
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700&display=swap">
<!-- Scripts -->
@vite(['resources/css/app.css', 'resources/js/app.js'])
</head>
<body>
<div class="font-sans text-gray-900 antialiased">
Hello World
</div>
</body>
</html>
My test route:
Route::get('/nice', function () {
return view('test');
});
The output below shows that the @vite is not generating the appropriate script and link assets tag:
My development environment is homestead, and I have laravel mix alongside since I am slowly upgrading our front-end to vite. I hope somebody here will be able to help me fix the issues and thank you.
709
Laravel 8 documentation says to install the laravel breeze using the following command.
composer require laravel/breeze --dev
But this will install the latest version of breeze (^1.10) with Laravel 9 Vite support. As Laravel 8 doesn't support Vite, you will have to use an older version of laravel breeze. Version 1.9.4 works for me with Laravel 8.
So try the following command to install laravel breeze instead:
composer require laravel/breeze:1.9.4
answered Sep 14 '25 17:09
You must clear view cache after upgrade framework version with command:
php artisan view:clear
Then this new blade directive must work properly.
36
answered Sep 14 '25 16:09
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With