0

Context

I joined a new project where I was asked to upgrade React from version 17 to 18. After upgrading react and react-dom and some other dependencies I got some warnings, which had to do with dependencies.

npm install react@latest react-dom@latest

Some of them I was able to resolve easily, by updating some packages. This was until I tried resolving the following warning:

npm WARN Conflicting peer dependency: react@17.0.2
npm WARN node_modules/react
npm WARN   peer react@"^16.3.0 || ^17.0.0" from react-side-effect@2.1.1
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

Already I am a bit surprised by the react@17.0.2. Apparently there is another version of React still in dependencies, that is required by another package.

Package that requires React 17.0.2

"<CUSTOM PACKAGE MADE BY SOMEONE ELSE>": {
      "version": "0.3.0",
      "resolved": <LINK>,
      "integrity": "sha1-Ah72HLxApcdcSPGRIE/L7wjy8Ec=",
      "dependencies": {
        <CUSTOM PACKAGE MADE THE SAME PERSON 2>: "^0.1.6",
        "react": "^17.0.2",
        "react-dom": "^17.0.2",
        "react-scripts": "5.0.0"
      }
    },

The actual dependency

"react": {
          "version": "17.0.2",
          "resolved": "https://registry.npmjs.org/react/-/react-17.0.2.tgz",
          "integrity": "sha512-gnhPt75i/dq/z3/6q/0asP78D0u592D5L1pd7M8P+dck6Fu/jJeL6iVVK23fptSUZj8Vjf++7wXA8UNclGQcbA==",
          "requires": {
            "loose-envify": "^1.1.0",
            "object-assign": "^4.1.1"
          }

Ancillary Question

Would having 2 versions of React in your package-lock.json not cause problems? I can't imagine these two version be used simultaneously. My guess would be that in this case this should be a peer dependency, am I correct to assume that?

Attempts

At first I thought that I could not update React yet, until react-helmet would be patched. I let my colleagues know, and they all said that another project also used react-helmet and they were able to update React. What?! Great impression on new colleagues .

Indeed opening the other project and installing the new React version there did not cause the same warning.

Question As an experiment I decided to remove the package-lock.json entirely. This resulted in the same errors. Removing the package-lock.json and the node_modules resolved it however! Why is this the case? The package that requires React 17.0.2 is still there as is the dependency for React version 17.0.2. Yet somehow, it is no longer a problem.

Any help to understand why this would resolve the situation would be greatly appreciated.

Note react-helmet seems to be unmaintained, so will need to be removed eventually. This is not what my question is about.

Fluous
  • 2,075
  • 2
  • 17
  • 29

1 Answers1

1

Apparently removing the node_modules and package-lock.json did not help at all. Removing both does not trigger the warning the first install. Once you run npm install again, the same warning will show.

So it seems the warnings do not show up at the first 'clean' install. This also seems to be true at the other project, however there is something more going on there.

In this case it will probably mean that we will need to replace react-helmet with react-helmet-async and update the version of the custom package.

Fluous
  • 2,075
  • 2
  • 17
  • 29