Vite triggers reload for any file in any folder

[robsontenorio]

Laravel Version

12.7.2

PHP Version

8.4.2

Spec

NPM 10.9.0
macOS 15.3.2

Description

After upgrading from Laravel 11 to 12, I have noticed this strange issue where Vite triggers full page reload for any file in any folder changed.

I am using the default settings for vite.config.js and app.css

As the docs say, not all folders will be watched.

https://laravel.com/docs/12.x/vite#blade-refreshing-on-save

Steps To Reproduce

• Bootstrap a Laravel 12 project with some starter kit (tested with Livewire starter kit).
• Install PHP/JS dependencies.
• npm run dev or yarn dev
• Start browsing the site (without modifying any file)
• While browsing, you will notice in some pages it will refresh unexpectedly , because storage/framework/*** changes.
• Try to modify any file like config/*** or database/*** , it will also refresh.

# Pretty random, but annoying.

1:58:51 PM [vite] (client) page reload storage/framework/views/feb9523037ff1142795d520cc7a929f4.php

[timacdonald]

@robsontenorio, can you please check your Tailwind CSS config file and see if the storage/framework/views directory is included in the content config?

If it is there, this issue is caused by Tailwind. Tailwind creates a circular dependency which forces Vite to perform a full-page reload.

You can test this out by leaving the refresh: true option in the vite.config.js and commenting ./storage/framework/views/*.php from the tailwind.config.js.

This is a known issue in Vite that I'm not sure can really be addressed: vitejs/vite#9512 (comment)

[robsontenorio]

Hey @timacdonald , it is a default Laravel 12 project template with Tailwind 4. There is no tailwind config file it relies on “app.css”.

https://github.com/laravel/laravel/blob/12.x/resources/css/app.css

But, the odd part is that Vite trigger reloads for all folders. Is that a known issue ?

[timacdonald]

If you comment out @source '../../storage/framework/views/*.php'; do you still see refresh issues coming from that directory?

In regards to other files, it wasn't intentional and I'm open to excluding them by default (#152 (comment)). This shouldn't really be the cause of your current troubles, though. Vite only refreshes when it needs to even if you change files it is watching.

[robsontenorio]

@timacdonald If I comment out @source '../../storage/framework/views/*.php'; I don't see the issue anymore, BUT only for that folder.

But, the annoying part is that it watches all other folder and files ...

Example:

• I have form that create files on disk and redirect to the next ... BUT, Vite reloads the page, breaking the navigation. Because a new file was created.
• In my case I put files at root app folder "/.data-test"

[timacdonald]

@robsontenorio, could you remove all @source lines and see if the issue continues?

[robsontenorio]

@timacdonald

Removed all @source , but it still trigger for other folders.

More context

• On brand new Laravel 11 project we don't have this issue.
• If you keep in Laravel 11, and setup Tailwind v4 with app.css approach (no JS configs) we don't have this issue
• The issue comes up with Laravel 12 + Tailwind v4. Even on a fresh new Laravel 12 template.

See here a brand new Laravel 12 template, with Livewire starer kit. It triggers a refresh for other folders.

bug2.mov

[robsontenorio]

Hey @timacdonald , let me know if you need more info.

Because even with “refresh: false” I have the same issue.

Can you reproduce this issue on a fresh new Laravel 12 app ?

[iurigustavo]

Can you try changing the first line of app.css to:

@import "tailwindcss" source(none);

Tailwind will scan every file in your project for class names, except in the following cases:

Files that are in your .gitignore file
Binary files like images, videos, or zip files
CSS files
Common package manager lock files

[timacdonald]

@robsontenorio, I've been able to reproduce the issue.

I'll have to spend some time pulling down the Tailwind plugin and Vite itself to debug what is actually happening here.

I'm relatively sure this is a Tailwind plugin issue, as I can remove the issue by commenting the plugin out.

[Daedalus11069]

I just ran into this problem myself. Based on the comment above by timacdonald, I downgraded the tailwind/vite plugin to 4.1.2, and this fixed the issue. Obviously not a great solution but I think that at least narrows the scope down to what's causing this.

[robsontenorio]

@Daedalus11069

Unfortunately, did not work for me when downgrading @tailwindcss/vite to 4.1.2. What else you downgraded?

Here is my package.json

    "devDependencies": {
        "@tailwindcss/vite": "4.1.2",
        "axios": "^1.8.2",
        "daisyui": "^5.0.17",
        "laravel-vite-plugin": "^1.2.0",
        "tailwindcss": "^4.1.3",
        "vite": "^6.2.5"
    }

[marchenkovma]

Hello @Daedalus11069, it doesn't work for me either.

[coclav]

We solve the issue by adding that in the main object returned of vite.config.ts

server: {
      watch: {
        ignored: ["**/*.php"]
      },
      hmr: {
        overlay: false
      }
    },

[robsontenorio]

@coclav Actually you are only disabling some features, so it is not solved 😢 .

As @timacdonald said, there is some bug somewhere in Vite / Tailwind, that need a fix.