Watch .html with Vite and reload browser

[fgeierst]

The Rollup watcher does not help here, because we want the browser to reload if the html templates change in Vite dev mode.

Maybe look at

• https://vitejs.dev/config/build-options.html#build-watch
• https://stackoverflow.com/questions/69626090/how-to-watch-public-directory-in-vite-project-for-hot-reload
• https://github.com/hex-ci/vite-plugin-virtual-html-template

[felixranesberger]

Interesting idea!

But isn't an automatic page reload every time a change is made a bit inefficient due to the somewhat more time-consuming fluid compilation?

I wonder if you could split the HTML files into logical chunks that are only recompiled when something has changed in the file. With Turbo, the individual parts could then be replaced on the fly on the web page.

But for this I lack the knowledge of how Fluid compiles files.

[fgeierst]

Watching template files is now working thanks to https://github.com/ElMassimo/vite-plugin-full-reload.

@felixranesberger Nice idea - let's see what the upcoming Topwire extension brings.

[fgeierst]

Here is a PR #20 by @misterboe that replaces vite-plugin-full-reload with a custom Vite plugin to watch html, typoscript, yaml and php files.

[misterboe]

Solved by #20

[fgeierst]

vite-plugin-full-reload works, too, but I preferred the solution by @misterboe because it removes a NPM dependency and two child dependencies from the setup. Thanks!