meteor / meteor/meteor

hot-module-replacement not working with React 18 hydrateRoot

Open
#12,161 6 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

confirmed idle Impact:some Project:HMR
Dominant language
JavaScript
Stars
44.8k
Forks
5.2k
Avg merge
3d 12h
Merged PRs (30d)
25

Description

Hey,
I'm trying to use hot-module-replacement with React 18 and the new hydrateRoot function, because we also use SSR. When editing a file, I get a HMR: updated 1 file within the console, but the page/component doesn't update. I tried it several times, I always need to reload the whole page by myself. When I downgrade to React 17 and use the old hydrate function, everything works fine again. So there seems to be a change within React 18 which prevents refreshing the component.

I've tested it on Meteor 2.7.3.

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by reproducing the issue on Meteor 2.7.3 with React 18's hydrateRoot and SSR, then compare it with React 17's hydrate behavior. Trace the HMR update path and verify that editing a component refreshes it without requiring a full-page reload.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, react
Domain
build-system, frontend
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
38/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.