No more live-reload with Vaadin Flow 24.3.7 and Java 21.0.2

Flow
1

I haven’t used Vaadin Flow for a few months (I was on a sabbatical and travelling). Now I’m back and live-reload is not working anymore. If I modify a CSS inside the frontend/themes folder, the browser will reload but change is not visible. Even cleaning the browser cache does not change the UI. I have to restart Vaadin for the browser to pick up the change. That is very annoying because designing the application now takes extremely long.

I start my application from inside IntelliJ IDEA 2023.3.6 in debug mode using the application class and set “on frame deactivation” to “update classes and resources”. I have no idea why live-reload stopped working. Any hints?

My focus as for now is to have live-reload enabled on CSS file modifications. Actually I don’t care of Java class modifications.

2

Do you have that little }> logo on low right corner? If not, you are probably running in “production mode” and your CSS is imported from the bundle. Try doing mvn clean (or even mvn vaadin:dance) and then starting your development server, that might solve it.

3

Yes, the browser shows the Vaadin logo in the corner with a green dot and if I click on it, it shows everything should be okay:

Java live reload available: Spring Boot Devtools
Vaadin development mode initialized
Page reloaded at 16:55:49

I did the Vaadin dance but it still does not work. When I modify a CSS file the browser does a reload of the page but it did not pick up the changes. I still have to restart the server.

4

Just asking the obvious: are you sure you saved the css file? e.g. pressing STRG + S? Once saved Vaadin / vite should tell so in the console…

If that doesn’t help… disabling dev bundle would be my second option to try.

5

So this is the next thing to try:

6

Disabling the pre-compiled development bundle solved my problem:

vaadin.frontend.hotdeploy=true

Live reload in the frontend is now working again. Thank you very much, @knoobie and @Matti!

1 Like