gatsby: Browser won't hot reload re-compiled sources, broken after `gatsby@2.24.9`

Description

Recent versions of gatsby have issues with hot-reload during gatsby develop. I’m constantly checking almost every release and this problem still persists as per gatsby@2.24.23. The latest OK version for me is gatsby@2.24.9 so I keep rolling back to it.

Steps to reproduce

I run gatsby develop and app is loaded OK
I edit any source code (be it a component or a graphql query)
gatsby develop script rebuilds sources without any error

Expected result

Browser updates the page.

Actual result

Browser starts loading and hangs forever, changes are not picked up. Manual page refresh is not working either. Only restart of develop script can help. However, GraphiQL editor keeps working.

Environment

  System:
    OS: Linux 5.4 Ubuntu 20.04.1 LTS (Focal Fossa)
    CPU: (4) x64 Intel(R) Core(TM) i5-7200U CPU @ 2.50GHz
    Shell: 5.8 - /usr/bin/zsh
  Binaries:
    Node: 14.6.0 - /usr/bin/node
    Yarn: 1.22.4 - /usr/bin/yarn
    npm: 6.14.6 - /usr/bin/npm
  Browsers:
    Chrome: 84.0.4147.105
    Firefox: 79.0
  npmPackages:
    gatsby: 2.24.23 => 2.24.23
    gatsby-image: 2.4.14 => 2.4.14
    gatsby-plugin-linaria: 2.1.0 => 2.1.0
    gatsby-plugin-manifest: 2.4.21 => 2.4.21
    gatsby-plugin-postcss: 2.3.11 => 2.3.11
    gatsby-plugin-purgecss: 5.0.0 => 5.0.0
    gatsby-plugin-react-helmet: 3.3.10 => 3.3.10
    gatsby-plugin-root-import: 2.0.5 => 2.0.5
    gatsby-plugin-sharp: 2.6.24 => 2.6.24
    gatsby-plugin-typescript: 2.4.16 => 2.4.16
    gatsby-source-filesystem: 2.3.23 => 2.3.23
    gatsby-source-multi-api: 1.0.5 => 1.0.5
    gatsby-transformer-sharp: 2.5.12 => 2.5.12

UPD: added note on GraphiQL

About this issue

Original URL
State: closed
Created 4 years ago
Reactions: 18
Comments: 37 (10 by maintainers)

Commits related to this issue

[Bugfix][Environment] Hot reload works incorrectly after version 2.24.9 ( https://github.com/gatsbyjs/gatsby/issues/26192 ) — committed to LyulyaevMaxim/battleship by LyulyaevMaxim 4 years ago
[Feature] Gameboard (part 1) (#2) * [Feature] Add game board. Now we can to start and restart game. I use mock data yet * [Feature][Modules] Add Ant Design for base stylization * [Bugfix][Envi... — committed to LyulyaevMaxim/battleship by LyulyaevMaxim 4 years ago

Most upvoted comments

Still broken in Gatsby 3

+27

joebentaylor1995 on Mar 10, 2021

This took a lot of tracking down, but I think I’ve fixed it. Thanks everyone for your information. I should have the release with the fix out today.

ascorbic on Sep 10, 2020

My server is working as it should now w/ the latest update gatsby@2.24.57 as @ascorbic said! 🎊

mikeyfe6 on Sep 10, 2020

This is still broken.

witcradg on May 24, 2021

OK, this should be fixed in gatsby@2.24.57. If it’s still broken for you after upgrading, please open a new issue with a repro

ascorbic on Sep 10, 2020

I tried downgrading to npm i gatsby@2.24.9 but it appears to not fix the problem for me. also, this problem is occurring for me across multiple gatsby projects on multiple computers. the hot reloading might work like 1 out of 5 times I save.

edit: i feel like this problem started recently, about roughly a month ago

theskillwithin on Aug 13, 2020

For me, rolling back to 2.24.9 from 2.24.47 restored hot reloading. It was consistently failing before I rolled back.

alpinegizmo on Aug 25, 2020

I has Event “xstate.after(1000)#waitingMachine.batchingNodeMutations” was sent to stopped service “waitingMachine” in terminal after some hot reloads.

Found this xstate issue and set ... "resolution": { "xstate": "4.9.1" } ... in package.json and after it worked without this error, but reloading took long time sometimes.

Reverting to “gatsby@2.24.9” actually works better.

LyulyaevMaxim on Aug 8, 2020

The same for me. Using Gatsby 3.3.0.

toffalori on Apr 27, 2021

I’m having to gatsby clean and clear browser cache every ~ 5 minutes just to get work done. Using Gatsby 3 latest.

beamercola on Mar 23, 2021

@ascorbic it’s still broken after @vladar’s change, here’s an issue with a repro: https://github.com/gatsbyjs/gatsby/issues/27626

@amankkg are you using https://github.com/callstack/linaria?

hartshorne on Oct 23, 2020

Sure, landed fix helped but I still face this bug sometimes, not so often tho. Needs investigation from my side

amankkg on Sep 14, 2020

@hartshorne yes I do

amankkg on Oct 25, 2020

Thanks for looking into this! In my case it still wasn’t working which I boiled down to the use of chokidar cli that was running two builds, after removing that and running the processes separately, all seems to work well!

souporserious on Sep 24, 2020

I’m just learning some gatsby@2.24.47 and general React things by following the tutorials on gatsbyjs.com and while ~~I’m not having hot reload issues~~, I started receiving this warning:

warn Warning: Event "xstate.after(1000)#waitingMachine.batchingNodeMutations" was sent to stopped service "waitingMachine". This service has already reached

…after I installed gatsby-source-filesystem@2.3.24 in part five of the tutorials. I found this GitHub issue by looking up the above warning.

When I remove gatsby-source-filesystem from my plugins in gatsby-config.js, this warning goes away.

No idea if this counts as a reproduction of this error, ~~since I’m not really having a hot reload problems as I said~~ Edit: Turns out, I’m also having hot reloading issues occasionally!, but hope it helps!

quamsta on Aug 18, 2020

Hi @amankkg !

Sorry to hear you’re running into an issue. The only PR published between 2.24.9 and 2.24.10 is https://github.com/gatsbyjs/gatsby/pull/25815

It can be the culprit. But the problem is that I couldn’t reproduce the issue on a fresh project (based on the hello-world starter). So we need your help.

It is incredibly helpful if you’re able to create a minimal reproduction. This is a simplified example of the issue that makes it clear and obvious what the issue is and how we can begin to debug it.

If you’re up for it, we’d very much appreciate if you could provide a minimal reproduction and we’ll be able to take another look.

Thanks for using Gatsby! 💜

vladar on Aug 3, 2020