framework7-template-vue-webpack icon indicating copy to clipboard operation
framework7-template-vue-webpack copied to clipboard

Hot reload doesn't working

Open Taxi4you opened this issue 5 years ago • 6 comments

I have cloned the project, ran npm install and npm start, changed something in the code - from MyApp to something else, and hot reload is not getting actioned.

I am using Mac, Chrome, Atom (tried also with Visual Studio Code).

Any fix for this?

Taxi4you avatar Mar 04 '19 10:03 Taxi4you

I'm experiencing the same issue. When I run "npm run dev" the app gets built. When I make a change to any of the files, the app is not rebuilt (nothing happens in the terminal).

I am using a Mac with Chrome and Atom as well.

danof avatar Apr 10 '19 19:04 danof

i'm modify file.vue and save but chrome console output : image @nolimits4web

759325100 avatar May 16 '19 09:05 759325100

I have found that I should bootstrap the app using this line: Framework7.use(Framework7React) (I am using React), and then (after the app is fully loaded) I comment this line and the hot module replacement is working.

This is not the best solution, since everytime I need to make hard refresh I have to uncomment this line, then hard refresh and then comment this line if I want HMR to be working.

@nolimits4web maybe you have an idea why this line collides with the Webpacks HMR?

Taxi4you avatar May 16 '19 09:05 Taxi4you

I got same issue.

natuan62 avatar Jun 17 '19 07:06 natuan62

I got the answer what I want from Natalia Sulkama in his article

I have faced the same issue, I mentioned it in the tutorial as well. It only happens in app.vue, and no other component or page, most likely because app.vue contains the f7-app root element, and the parameters to initialize Framework7, so hot-reloading causes Framework7 to re-initialize which causes an error. To avoid this the best way is to just not edit app.vue as much, and instead use components which you import in app.vue. I hope it helps!

https://medium.com/js-dojo/creating-a-todo-app-using-vuejs-and-framework7-f18236cdd099

natuan62 avatar Jul 02 '19 04:07 natuan62

I use this template, using Axios to display data from the API, I previously did the same thing without using webpack and it works fine, I tried to use this template, the method is executed properly but the data appears Only when I save the file for the second time, can you help me?

gawirable avatar Aug 17 '19 06:08 gawirable