TypeScript dependency conflict with npm 7 / node 14

[chludwig-haufe]

If I run npx create-react-app my-app --template must-have-libraries with npm 7.9.0 / node 14.16.0 (also tested with npm 7.6.0), I get the following dependency resolution error:

Could not resolve dependency:
peerOptional typescript@"^3.2.1" from [email protected]
node_modules/cra-template-must-have-libraries/node_modules/react-scripts
  react-scripts@"3.4.1" from [email protected]
  node_modules/cra-template-must-have-libraries
    cra-template-must-have-libraries@"*" from the root project

The full eresolve-report.txt is attached.

Using npm 6.14.12 / node 12.22.1, creation of the app succeeds.

First I suspected this to be a regression of facebook/create-react-app#9964, but npx create-react-app my-app --template typescript succeeds using npm 7 / node 14 as well. It therefore is specific to cra-template-must-have-libraries.

[EliEladElrom]

Hi @chludwig-haufe,

I am sorry to hear you are having challenges building.

This project includes other libraries and it is upgraded in terms of React, TS and other libraries, so having CRA vanilla or CRA TS version doesn't necessarily means that there is a problem with this CRA template.

As you can see from the action tab: action (you can see in the action tab and see the build, test etc passing icons). The project is building without a hick, it's building on a Ubuntu machine using the same npx command you are using. ​

I went ahead and upgraded the actions to start building and testing the Github actions using Node v14 (instead of v12) that's using the npx and it's building correctly - you can still see on the action tab and the project icons passing icons.

Additionally, I tried to build locally on a Mac 10.15.7 with Node v12.19.0, v14.13.1 and even v15.14.0, using both yarn and npx commands and couldn't reproduce your error.

All these things are leading me to believe that this is most likely to do with your personal machine's configuration. Maybe you have some libraries installed globally that are overtaking some of the local project libraries used and causing this.

Looking quickly at your file I see few things a bit off in your error file.

• The project typescript should be at "^4.2.3", but your error logs shows 3.4.1. (Could not resolve dependency: peerOptional typescript@"^3.2.1" from [email protected])
• cra-template-must-have-libraries should have been version 17.0.007, but your file shows: 17.0.7

Solutions:

1. Try to re-install using the yarn command.
2. You could take the CRA TS project and manually add each additional library in this project one by one.
   There is a link for the Medium article to add the libraries one by one plus a Udemy course.

If you get any progress in term of pointing out that there is a specific error related to this project, please feel free to open this ticket or new one.

Best, Eli

[chludwig-haufe]

Hi @EliEladElrom ,

well, the most obvious difference I see between your build on GitHub using Node v14 and my build is the npm version: In your case it's still npm 6.14.11, I have 7.9.0. The build breaks due to a peer dependency and the change to peer dependency resolution was announced as an “exciting new feature” of npm 7...

Indeed, if I run npm init --legacy-peer-deps react-app my-app --template must-have-libraries with Node v14 and npm 7.9.0, then the app creation completes apparently successfully.

react-scripts 4.0.3 declares a peer dependency on typescript ^3.2.1 || ^4. I cannot find any dependency on typescript in the generated package-lock.json that would require typescript < 4..0. I therefore don't understand either why npm 7 does not accept typescript 4.2.4 as a valid resolution. But I am not familiar with npm at all, I might very well miss something.

This issue is not blocking me. But if your template is not compatible with npm 7 (whatever the reason), then I think it's worth a note in the README.

Cheers,
Christoph

[chludwig-haufe]

Searching the npm issues, this might actually be a manifestation of npm/cli#2999. (It was yesterday marked as a prio 1 bug.)

[EliEladElrom]

@chludwig-haufe thanks for the research. I haven't tried with npm v7.9. Personally, I prefer yarn. Sounds like they are on it and hopefully will get resolved soon. Maybe move to yarn ;)