Hot Reload not working in React 17.0.3

React
1

Hi,

I have recently created a new project with create-react-app. Also, I am following Mosh’s Mastering React course and according to it, if you make any changes in your project the changes should automatically reload in your browser.

But its not working for me. I am using React 17.0.3.

Any ideas?

Regards,

Maria

1 Like
2

So the page doesn’t auto-reload, but if you manually click the refresh button in the browser, you see the changes? Are you using npm start to run the app?

3

Yes Rob, if I manually click the refresh button it works. Also, I am using npm start to run the app.

4

Hi.

Just found some more on our good old StackOverflow.

The first answer gives pointers on possible reasons why it is not reloading automatically.
Some of these are platform specific.

Hope this helps.

Regards.

5

If you are on Windows, then we maybe have the same issue.
After hours of researching and digging everywhere I found the solution.

You need to open a linux WSL instance and copy all of the project source code there and run all the commands in the bash or shell.

The way I did it:
In VS code go to the plugin Remote Explorer
If you don’t already have it, install it in vs code:
VS Marketplace Link: Remote Explorer - Visual Studio Marketplace

Press on + to add a distro (I’ve added ubuntu latest version)
When you are in the terminal make sure to install curl and then node
Note: use “sudo” or switch to root if you got permission issues “sudo su root”

  • go to the source code in Windows and make sure to delete node_modules
    then:
  • copy files from /mnt/your/project/path to ~/my_project
  • cd ~/my_project
  • npm install

And you are ready :slight_smile: