I have a ReactJS+NextJS based interactive project where user can upload their picture and manupulate face and animate it but when we try to do this due to HMR page reloads automatically and whole user data is losted. I am trying very hart to prevent HMR not getting way to prevent it!!!
This may not be best solution but it work for me.
Issue: I deploy my web project on server it was refreshing within 30 seconds automatically due to HRM Strylesheets reload.
Solution: I found that when console shows HMR Stylesheet it shows css filename too, Then I pick that css file in my code to debug.
I block half css file and make build again and deploy that on dummy server, Then I found It is not showing HMR issue, again and again I shrink css code blocking and finally I found one css tag "background color" was making this annoying issue, I remove that tag and take alternative solution and It works for me.