Gatsby hot reloading does not reload in the Hello World starter project

Question

Description

I am following along with the instructions here: https://www.gatsbyjs.org/tutorial/part-one/ When I start the dev server and make a change to src/pages/index.js it is not hot reloaded in my browser.

---

Steps to Reproduce

Using gatsby-cli:

• gatsby new hello-world https://github.com/gatsbyjs/gatsby-starter-hello-world
• cd hello-world
• gatsby develop
• change the text inside of the div in src/pages/index.js

---

Expected Result

Page would automatically reload with new text.

---

Actual Result

Page would not change unless a manual refresh was applied in the browser.

---

Specs

OS: Ubuntu 18.04.3 LTS running in WSL on Windows 10 Pro

Node: 12.12.0

NPM: 6.11.3

Gatsby CLI: 2.8.8

Gatsby: 2.17.6

Browsers: Chrome 77.0.3865.120, IE 11.1006.17134.0, Firefox 70.0

---

I've tried multiple browsers with the same result so I ran devtools in firefox and examined the console output when I make a change and I see this error:

The connection to http://localhost:8000/__webpack_hmr was interrupted while the page was loading. client.js:88
[HMR] Update check failed: hotDownloadManifest/</request.onreadystatechange@http://localhost:8000/commons.js:42:16
process-update.js:147
Error: Manifest request to /d528b21bff3fd2caa92d.hot-update.json timed out. bootstrap:41
Firefox can’t establish a connection to the server at http://localhost:8000/__webpack_hmr. client.js:88

I've also looked around on github and here and haven't found a solution to my problem. Any ideas on a workaround, solution, or insight into why this might not be working for me would be greatly appreciated!

Answer 1

I was having same problems. Gatsby Develop hot reload was not working whenever I made changes to files, plus, Gatsby Develop was terribly slow to compile code and get the dev server up and running. I found out that if I create my Gatsby project in Linux directory structure instead of Windows, everything works out good and is blazing fast. So my solution was following.

Create your project in /home/<your_username> directory in WSL. Simply go to /home/<your_username> and make a folder there with mkdir; go to that folder and then run Gatsby create my_project command in that folder.

That way your project will reside in Linux directory structure, making everything run smoothly.