Skip to content

Unable to Create a New React App Using npx create-react-app #13776

Closed
Closed
Unable to Create a New React App Using npx create-react-app#13776
Labels
issue: bug reportneeds triage

Description

@itsRkator
itsRkator
opened on Dec 30, 2024

Description

I've been facing issues when creating a new React app using the npx create-react-app command for the past 1 1.5 months. Despite trying multiple solutions, the problem persists, making it impossible to set up a new React project.

Steps to Reproduce

  1. Run the command: npx create-react-app my-app.
  2. Attempted the following flags to bypass errors:
    • --force
    • --legacy-peer-deps
  3. Tried on different systems and environments:
    • Operating Systems: Windows 10/11, macOS
    • Networks: Airtel and BSNL ISPs
  4. Tested on various Node.js versions (all managed with NVM):
    • 16.x (LTS)
    • 18.x (LTS)
    • 20.x (LTS)
    • 22.x (LTS)

Expected Behavior

After running the npx create-react-app command, a new React app should be successfully created.

Actual Behavior

The command fails to complete successfully. I've attached screenshots of the errors encountered below for you to look over.

Attempts to Fix

  • Used --force and --legacy-peer-deps flags.
  • Tried different versions of Node.js.
  • Tested on different operating systems and networks.

Environment

  • OS: Windows 10/11, macOS
  • Node.js: 16, 18, 20, and 22 (LTS versions)
  • NPM: Latest version (installed with Node.js)
  • React: The npx create-react-app version is the default fetched by NPM.

Attachments

(Screenshots of the error messages)

Screenshot 2024-12-30 at 4 37 35 PM Screenshot 2024-12-30 at 4 39 03 PM Screenshot 2024-12-30 at 4 41 21 PM Screenshot 2024-12-30 at 4 44 08 PM Screenshot 2024-12-30 at 4 44 42 PM Screenshot 2024-12-30 at 4 45 54 PM Screenshot 2024-12-30 at 4 46 57 PM Screenshot 2024-12-30 at 4 48 06 PM

Additional Information

This issue has persisted across multiple environments and configurations for over a month. Please let me know if further details or debugging information are needed to assist in resolving this issue.

Activity

  1. itsRkator
    added
    issue: bug report
    needs triage
    on Dec 30, 2024

  2. lakpahana commented on Dec 30, 2024

    @lakpahana
    lakpahana
    on Dec 30, 2024

    Could you please attach the log files as well? That would be very helpful.

    Thank you!

  3. Nithesh0812 commented on Dec 30, 2024

    @Nithesh0812
    Nithesh0812
    on Dec 30, 2024

    try this command "npx create-react-app@latest react-18-20-5"

  4. itsRkator commented on Dec 31, 2024

    @itsRkator
    itsRkator
    on Dec 31, 2024
    Author

    @Nithesh0812 This also didn't work.

    @lakpahana Here are the files:
    2024-12-31T01_45_25_149Z-debug-0.log
    2024-12-31T01_45_25_149Z-eresolve-report.txt

  5. jesobreira commented on Dec 31, 2024

    @jesobreira
    jesobreira
    on Dec 31, 2024

    Same issue here. Windows and Ubuntu.

    Using --legacy-peer-deps here makes CRA complete, but running npm start fails:

    image

  6. Ting-Ching-Chou commented on Dec 31, 2024

    @Ting-Ching-Chou
    Ting-Ching-Chou
    on Dec 31, 2024

    Same issues are found in TypeScript template.

    image

    0 verbose cli /usr/local/bin/node /usr/local/bin/npm
1 info using npm@10.7.0
2 info using node@v20.14.0
3 silly config:load:file:/usr/local/lib/node_modules/npm/npmrc
4 silly config:load:file:/home/tcc/Desktop/Practice_05/my-app-2/.npmrc
5 silly config:load:file:/home/tcc/.npmrc
6 silly config:load:file:/usr/local/etc/npmrc
7 verbose title npm install @testing-library/jest-dom@^5.14.1 @testing-library/react@^13.0.0 @testing-library/user-event@^13.2.1 @types/jest@^27.0.1 @types/node@^16.7.13 @types/react@^18.0.0 @types/react-dom@^18.0.0 typescript@^4.4.2 web-vitals@^2.1.0
8 verbose argv "install" "--no-audit" "--save" "@testing-library/jest-dom@^5.14.1" "@testing-library/react@^13.0.0" "@testing-library/user-event@^13.2.1" "@types/jest@^27.0.1" "@types/node@^16.7.13" "@types/react@^18.0.0" "@types/react-dom@^18.0.0" "typescript@^4.4.2" "web-vitals@^2.1.0"
9 verbose logfile logs-max:10 dir:/home/tcc/.npm/_logs/2024-12-31T11_35_17_028Z-
10 verbose logfile /home/tcc/.npm/_logs/2024-12-31T11_35_17_028Z-debug-0.log
11 silly logfile start cleaning logs, removing 1 files
12 silly logfile done cleaning log files
13 silly idealTree buildDeps
14 silly fetch manifest @testing-library/jest-dom@^5.14.1
15 http fetch GET 200 https://registry.npmjs.org/@testing-library%2fjest-dom 850ms (cache updated)
16 silly fetch manifest @testing-library/react@^13.0.0
17 http fetch GET 200 https://registry.npmjs.org/@testing-library%2freact 120ms (cache updated)
18 silly fetch manifest react@^19.0.0
19 http fetch GET 200 https://registry.npmjs.org/react 19ms (cache hit)
20 silly fetch manifest react@^18.0.0
21 verbose stack Error: unable to resolve dependency tree
21 verbose stack     at #failPeerConflict (/usr/local/lib/node_modules/npm/node_modules/@npmcli/arborist/lib/arborist/build-ideal-tree.js:1386:25)
21 verbose stack     at #loadPeerSet (/usr/local/lib/node_modules/npm/node_modules/@npmcli/arborist/lib/arborist/build-ideal-tree.js:1352:33)
21 verbose stack     at async #buildDepStep (/usr/local/lib/node_modules/npm/node_modules/@npmcli/arborist/lib/arborist/build-ideal-tree.js:923:11)
21 verbose stack     at async Arborist.buildIdealTree (/usr/local/lib/node_modules/npm/node_modules/@npmcli/arborist/lib/arborist/build-ideal-tree.js:203:7)
21 verbose stack     at async Promise.all (index 1)
21 verbose stack     at async Arborist.reify (/usr/local/lib/node_modules/npm/node_modules/@npmcli/arborist/lib/arborist/reify.js:131:5)
21 verbose stack     at async Install.exec (/usr/local/lib/node_modules/npm/lib/commands/install.js:150:5)
21 verbose stack     at async module.exports (/usr/local/lib/node_modules/npm/lib/cli/entry.js:74:5)
22 verbose cwd /home/tcc/Desktop/Practice_05/my-app-2
23 verbose Linux 5.15.0-130-generic
24 verbose node v20.14.0
25 verbose npm  v10.7.0
26 error code ERESOLVE
27 error ERESOLVE unable to resolve dependency tree
28 error
29 error While resolving: my-app-2@0.1.0
29 error Found: react@19.0.0�[2m�[22m
29 error �[2mnode_modules/react�[22m
29 error   react@"^19.0.0" from the root project
29 error
29 error Could not resolve dependency:
29 error �[95mpeer�[39m react@"^18.0.0" from @testing-library/react@13.4.0�[2m�[22m
29 error �[2mnode_modules/@testing-library/react�[22m
29 error   @testing-library/react@"^13.0.0" from the root project
29 error
29 error Fix the upstream dependency conflict, or retry
29 error this command with --force or --legacy-peer-deps
29 error to accept an incorrect (and potentially broken) dependency resolution.
30 error
30 error
30 error For a full report see:
30 error /home/tcc/.npm/_logs/2024-12-31T11_35_17_028Z-eresolve-report.txt
31 verbose exit 1
32 verbose code 1
33 silly unfinished npm timer reify 1735644917402
34 silly unfinished npm timer reify:loadTrees 1735644917438
35 silly unfinished npm timer idealTree:buildDeps 1735644918531
36 silly unfinished npm timer idealTree:#root 1735644918532
37 error A complete log of this run can be found in: /home/tcc/.npm/_logs/2024-12-31T11_35_17_028Z-debug-0.log

  7. tabax commented on Jan 1, 2025

    @tabax
    tabax
    on Jan 1, 2025

    Still reproducible with node 23.5.0 (via nvm, OS: Windows 11) as well:

    Installing template dependencies using npm...
npm error code ERESOLVE
npm error ERESOLVE unable to resolve dependency tree
npm error
npm error While resolving: my-app@0.1.0
npm error Found: react@19.0.0
npm error node_modules/react
npm error   react@"^19.0.0" from the root project
npm error
npm error Could not resolve dependency:
npm error peer react@"^18.0.0" from @testing-library/react@13.4.0
npm error node_modules/@testing-library/react
npm error   @testing-library/react@"^13.0.0" from the root project
npm error
npm error Fix the upstream dependency conflict, or retry
npm error this command with --force or --legacy-peer-deps
npm error to accept an incorrect (and potentially broken) dependency resolution.
npm error
npm error
npm error For a full report see:
npm error C:\Users\xxx\AppData\Local\npm-cache\_logs\2025-01-01T14_37_00_042Z-eresolve-report.txt
npm error A complete log of this run can be found in: C:\Users\xxx\AppData\Local\npm-cache\_logs\2025-01-01T14_37_00_042Z-debug-0.log
`npm install --no-audit --save @testing-library/jest-dom@^5.14.1 @testing-library/react@^13.0.0 @testing-library/user-event@^13.2.1 web-vitals@^2.1.0` failed

  8. tabax commented on Jan 1, 2025

    @tabax
    tabax
    on Jan 1, 2025

    This is an unmaintained project (see: reactjs/react.dev#5487).

  9. tonydiep commented on Jan 2, 2025

    @tonydiep
    tonydiep
    on Jan 2, 2025

    create-react-app does not create a working react app for me either in Ubuntu 24.04
    npm start does start but displays page with error message

    ERROR in ./src/reportWebVitals.js 5:4-24
Module not found: Error: Can't resolve 'web-vitals' in

  10. tonydiep commented on Jan 2, 2025

    @tonydiep
    tonydiep
    on Jan 2, 2025

    Here's what resolves it:

    npm i web-vitals

    I gotta say I'd prefer if this 'hello world' program didn't track and report users' behaviour with web-vitals. Someone using this is trying out react, not signing up to report anybody's activity.

  11. itsRkator commented on Jan 2, 2025

    @itsRkator
    itsRkator
    on Jan 2, 2025
    Author

    This is an unmaintained project (see: reactjs/react.dev#5487).

    @tabax I found no official documentation supporting your words on the official create-react-app repository, and official react documentation. Even the official reaction.dev documentation is for Next.js and also suggests using npx create-next-app@latest to create a new next app, though we are talking about React.js, not Next.js. See: https://react.dev/learn/start-a-new-react-project

  12. anipnwr7777 commented on Jan 3, 2025

    @anipnwr7777
    anipnwr7777
    on Jan 3, 2025

    @itsRkator There are a bunch of solutions available out there for this issue. React is coming with major v19 but peers are expecting react to be in v18 and hence the issues.

    After the error comes up cd inside the project and install the latest version of peers which will depend on v19 of react and the issue will be resolved.

    npm install @testing-library/jest-dom@latest @testing-library/react@latest @testing-library/user-event@latest web-vitals@latest

    after this npm start should fix the issue.

  13. kwikwag commented on Jan 3, 2025

    @kwikwag
    kwikwag
    on Jan 3, 2025

    This is indeed all very confusing.
    The reactjs react.dev repo says create-react-app is dead.
    After using create-react-app and running for the first time, one is presented with the message "babel-preset-react-app is part of the create-react-app project, which is not maintianed anymore." [sic]
    However https://github.com/facebook/create-react-app/ has no mention of this, nor does the website.
    Anyway, the React website does give other options.
    If you still want to, npx yarn create react-app xxx seems to be working.

  14. vdespa commented on Jan 4, 2025

    @vdespa
    vdespa
    on Jan 4, 2025

    I've been using this for years in educational examples but now it's time to move on.

    So people, stop wasting your precious time with this unmaintained project. This error has been reported for weeks already.

    At least give a chance to other projects like Vite, which work, are maintained, and have amazing documentation and community support.

    Here is what you need to get started:

    npm create vite@latest my-app -- --template react

    It's almost the same setup that this tool creates, with the only minor disadvantage that you need to set up tests afterward. But this can also be solved in just 2-3 minutes by following a tutorial.

  15. itsRkator commented on Jan 6, 2025

    @itsRkator
    itsRkator
    on Jan 6, 2025
    Author

    For now, I found a temporary solution to fix this issue. Use CRA's default command and then cd into the project and install the latest versions of web-vitals and testing-library/react dependencies using npm install @testing-library/react@latest web-vitals@latest. As @anipnwr7777 suggested, the peers expect different versions, and the CRA installed the newest version of React. Hence, we must get the latest versions of the other dependencies mentioned in the error message.

  16. Ismailkh356 commented on Jan 9, 2025

    @Ismailkh356
    Ismailkh356
    on Jan 9, 2025

    Still reproducible with node 23.5.0 (via nvm, OS: Windows 11) as well:

    Installing template dependencies using npm...
npm error code ERESOLVE
npm error ERESOLVE unable to resolve dependency tree
npm error
npm error While resolving: my-app@0.1.0
npm error Found: react@19.0.0
npm error node_modules/react
npm error   react@"^19.0.0" from the root project
npm error
npm error Could not resolve dependency:
npm error peer react@"^18.0.0" from @testing-library/react@13.4.0
npm error node_modules/@testing-library/react
npm error   @testing-library/react@"^13.0.0" from the root project
npm error
npm error Fix the upstream dependency conflict, or retry
npm error this command with --force or --legacy-peer-deps
npm error to accept an incorrect (and potentially broken) dependency resolution.
npm error
npm error
npm error For a full report see:
npm error C:\Users\xxx\AppData\Local\npm-cache\_logs\2025-01-01T14_37_00_042Z-eresolve-report.txt
npm error A complete log of this run can be found in: C:\Users\xxx\AppData\Local\npm-cache\_logs\2025-01-01T14_37_00_042Z-debug-0.log
`npm install --no-audit --save @testing-library/jest-dom@^5.14.1 @testing-library/react@^13.0.0 @testing-library/user-event@^13.2.1 web-vitals@^2.1.0` failed

    I had Resolve the issue..

    I had overcome this issue, i had used many ways and technique but i doesn't work.
    Here's how, I resolve the issue_
    First you need to remove all the npm caches etc then use this commands one by one..

    "npm create vite@latest my-app -- --template react
    cd my-app
    npm install
    npm run dev
    "
    After running the last command, will see "http://localhost:3000/" You can access it just copy it and run on the browser then start developing..

    I'm hopping that this would works f fine. If yes please to forgot to tell me or please follow me for more....

  17. carreyda commented on Jan 23, 2025

    @carreyda
    carreyda
    on Jan 23, 2025

    I have encountered the same problem. Is there a successful solution?

  18. itsRkator commented on Feb 22, 2025

    @itsRkator
    itsRkator
    on Feb 22, 2025
    Author

    Create React App is Officially Deprecated 🚨

    On February 14, 2025, the React team officially deprecated Create React App (CRA) for new projects. Since its launch in 2016, CRA has helped developers quickly set up React applications without complex configurations.

    ↗️ Why is CRA being deprecated?

    With the rise of modern build tools like Next.js, Vite, Parcel, and RS Build, CRA has become outdated and lacks active maintenance.

    ↗️ What does this mean for developers?

    Installing CRA now triggers a deprecation warning.

    Existing CRA projects will continue to function but will remain in maintenance mode.

    The React team recommends migrating to a modern framework for better performance and scalability.

    ↗️ What's next?

    ✔ Use Next.js, Vite, or another modern framework for new projects.
    ✔ Follow migration guides from Next.js, React Router, and Expo to transition existing apps.

    https://react.dev/blog/2025/02/14/sunsetting-create-react-app

  19. itsRkator
    closed this as completedon Feb 22, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    issue: bug reportneeds triage

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions