I am developing a custom app in Frappe Framework using Vue.js as the frontend framework. The Vue frontend is connected to an HTML page inside the www folder of Frappe.
I have already configured the Procfile and added the required watch commands. When I edit Vue files, the assets are rebuilt correctly while running bench start.
The issue is that the changes are not automatically reflected in the browser at localhost:8000/.... I currently need to manually perform a hard reload every time to see the updates.
I know that standard Hot Module Replacement (HMR) usually runs on a separate development server such as localhost:8080 or localhost:5173, but that is not the setup I want.
My requirement is:
I want to continue using the Frappe server at
localhost:8000I do not want a separate frontend development server
I want automatic browser reload or live reload directly on the Frappe-served page whenever Vue files are modified
How can this be implemented properly in a Frappe + Vue setup? What configurations or tools are needed to achieve automatic reload on localhost:8000 itself without manually refreshing the page?