Peer Dependency Conflict: react-side-effect (via react-helmet) not compatible with React v19

[NimaBakhtiyari]

We are experiencing a peer dependency conflict when using React v19.0.0. The issue arises from the dependency chain in which:

• react-helmet (v6.1.0) depends on react-side-effect (v2.1.2), and
• react-side-effect requires React to be one of: ^16.3.0 || ^17.0.0 || ^18.0.0.

Since our project uses React v19.0.0, npm reports this conflict and forces us to either override peer dependencies using --legacy-peer-deps or downgrade React to a supported version.

Error Example

npm warn While resolving: react-side-effect@2.1.2 npm warn Found: react@19.0.0 npm warn node_modules/react npm warn react@"^19.0.0" from the root project npm warn 19 more (@emotion/react, @emotion/styled, ...) npm warn npm warn Could not resolve dependency: npm warn peer react@"^16.3.0 || ^17.0.0 || ^18.0.0" from react-side-effect@2.1.2 npm warn node_modules/react-helmet/node_modules/react-side-effect npm warn react-side-effect@"^2.1.0" from react-helmet@6.1.0 npm warn node_modules/react-helmet

Impact

While our project currently builds and runs (especially using the --legacy-peer-deps flag), ignoring this conflict could lead to unexpected behavior during future dependency upgrades, runtime issues, or production builds. Relying on overridden peer dependency resolution is not ideal for ensuring long-term stability.

Suggested Fix

• Update Approach: Update react-helmet and its dependency react-side-effect to support React v19.
• Documentation: Alternatively, provide updated documentation indicating that React v19 is not officially supported or advise users to use a compatible React version.
• Version Release: Consider releasing a new major version of react-helmet (and consequently react-side-effect) that explicitly supports React v19.

Steps to Reproduce

1. Create a project with the following dependencies in package.json:
   • "react": "^19.0.0"
   • "react-helmet": "^6.1.0"
2. Run npm install.
3. Observe the peer dependency error regarding react-side-effect.

Environment Details

• React version: 19.0.0
• react-helmet version: 6.1.0 (with react-side-effect@2.1.2)
• Node version: v22.13.1
• npm version: 11.0.0
• OS: Windows

Please let me know if further details or logs are needed.

Thanks for your help!

[birdofpreyru]

Haven't you noticed, this library hasn't been maintained for nearly 5 years? Effectively react-helmet-async was a replacement, upgraded to React 18 standards (in particular, it got rid of react-side-effect dependency), but it looks its owner also lost his interest in maintaining it.

Good news are, I've forked react-helmet-async and released it to NPM as a new package, @dr.pogodin/react-helmet. You probably want to migrate to that — as of now its published version is just the same as the latest react-helmet-async release, only with package.json corrected to declare React v19 as its peer dependency; but I am already working on refactoring it to bring its codebase to the latest React standards, to fix some bugs I am finding on the way, and I'm planning to take care of its proper maintenance going forward :)

[Mehsan-Ali]

Appreciated man. do it as soon as possible

[NimaBakhtiyari]

Haven't you noticed, this library hasn't been maintained for nearly 5 years? Effectively react-helmet-async was a replacement, upgraded to React 18 standards (in particular, it got rid of react-side-effect dependency), but it looks its owner also lost his interest in maintaining it.

Good news are, I've forked react-helmet-async and released it to NPM as a new package, @dr.pogodin/react-helmet. You probably want to migrate to that — as of now its published version is just the same as the latest react-helmet-async release, only with package.json corrected to declare React v19 as its peer dependency; but I am already working on refactoring it to bring its codebase to the latest React standards, to fix some bugs I am finding on the way, and I'm planning to take care of its proper maintenance going forward :)

thank you

[birdofpreyru]

Hey, thanks for your messages of support!

I just want to reassure you that although not much activity is visible in my forked repo, I am actively working on refactoring of the library locally on my machine. Though, considering all the obligations and priorities I have for different projects I do for paying clients, it will probably take me a month or two to complete the refactoring (i.e. expect it by the end of April, 2025). In the meantime, as I mentioned, you can already switch to my fork published at NPM (@dr.pogodin/react-helmet) — for now it is just the same as the original library, beside its declared peer dependency on React is changed to v19; but having my fork as a dependency will make it easier to notice when the refactored version is available.

If anybody wants to support me monetary, so that going forward I can dedicate more of my time to this and similar opensource projects, I have GitHub Sponsors account set up 🤗

[strogonoff]

Heads up: for most regular use cases, React 19 does not need the Helmet library (or a fork). The functionality is built-in and works in client-side and SSR natively: https://react.dev/blog/2024/12/05/react-19#support-for-metadata-tags

[birdofpreyru]

@strogonoff Wrong! For a regular, general use case React 19 needs Helmet library or alike. That is because the general use case is to have title and meta tags generated based on the actual content of rendered page, i.e. individual components rendered into a complex page need a way to write and re-write title and meta tags. That (along with SSR) is necessary for search-engine optimization purposes, for open graph purposes (previews of linked pages in social media), etc. That is handled by Helmet (it correctly aggregates title and meta tags asked by different components in React tree, to output those with the highest priority and avoid duplicates), and that is not what React 19's trivial implementation does (it just pushes every instance of title and meta tags to the page, not caring about their duplication, and that some of them need to overwrite others).

The way you commented it under my message also just pisses me off. Essentially, the way I see it, I wrote that I am forking an opensource library, and investing my time into necessary upgrades and maintenance, mentioning that any support is more welcome. Let's be honest, small-scale opensource projects, like this one, actually get about zero financial support from sponsors. Still, your message just reads beware, nobody actually needs this library, nor his fork, DO NOT SPONSOR THIS DUDE. Thus... funding any opensource project is generally fucked up, but then some dudes just go around and make it even harder 😅

[fabiancook]

Using <title>Some title</title> within my components was the most direct method with react 19... it seems to have also handled order of application and re-writes where there is a duplicate.

[AkhilLV]

For those who are using a routing solution, React Router and Tanstack Router provide dynamic meta tags out of the box.

https://tanstack.com/router/v1/docs/framework/react/guide/document-head-management
https://reactrouter.com/start/framework/route-module#meta

With react router even recommending to use the native React 19 feature