"npx create-react-app my-app" stopped working in 4.0.3 #10601

peterbe · 2021-02-23T16:14:58Z

Describe the bug

/tmp
▶ npx create-react-app my-app

You are running `create-react-app` 4.0.1, which is behind the latest release (4.0.3).

We no longer support global installation of Create React App.

Please remove any global installs with one of the following commands:
- npm uninstall -g create-react-app
- yarn global remove create-react-app

The latest instructions for creating a new app can be found here:
https://create-react-app.dev/docs/getting-started/

npm ERR! code 1
npm ERR! path /private/tmp
npm ERR! command failed
npm ERR! command sh -c create-react-app my-app

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/peterbe/.npm/_logs/2021-02-23T16_06_05_071Z-debug.log

/tmp
▶ npx --version
7.5.6

If create-react-app is not meant to work with npx, then https://create-react-app.dev/docs/getting-started/ is wrong.

Did you try recovering your dependencies?

not applicable

Which terms did you search for in User Guide?

npx
getting started

Environment

OSX Big Sur
npm 7.5.6
node v15.2.1

Steps to reproduce

cd /tmp/
npx create-react-app my-app

Expected behavior

That it should create a directory called my-app.

Actual behavior

See error above.

Reproducible demo

Not applicable.

The text was updated successfully, but these errors were encountered:

peterbe · 2021-02-23T16:19:21Z

Doesn't work for npm init either :(

/tmp
▶ npm init react-app my-app
Need to install the following packages:
  create-react-app
Ok to proceed? (y) y

You are running `create-react-app` 4.0.1, which is behind the latest release (4.0.3).

We no longer support global installation of Create React App.

Please remove any global installs with one of the following commands:
- npm uninstall -g create-react-app
- yarn global remove create-react-app

The latest instructions for creating a new app can be found here:
https://create-react-app.dev/docs/getting-started/

npm ERR! code 1
npm ERR! path /private/tmp
npm ERR! command failed
npm ERR! command sh -c create-react-app "my-app"

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/peterbe/.npm/_logs/2021-02-23T16_19_01_954Z-debug.log

Sverxsro4nik · 2021-02-23T17:26:01Z

Faced a similar problem. The package was not installed globally, but there is no way to deploy the project

BenJenkinson · 2021-02-24T09:53:21Z

I just encountered this problem as well.

As a possible workaround, this worked for me:

npx create-react-app@latest my-app

Sverxsro4nik · 2021-02-24T15:26:16Z

npx create-react-app@latest my-app

Many thanks. It helped. Launched

peterbe · 2021-02-24T16:09:40Z

So all we have to do is sit tight and wait for a new release? That seems reasonable. We can simply keep this issue open till 4.0.4 comes out and then we go back and check that you no longer need to add the @latest to make it work. And if so, close this.

BenJenkinson · 2021-02-24T16:52:10Z

So all we have to do is sit tight and wait for a new release? That seems reasonable. We can simply keep this issue open till 4.0.4 comes out and then we go back and check that you no longer need to add the @latest to make it work. And if so, close this.

I'm not sure it's related to 4.0.3 specifically. After all, we weren't running 4.0.3, that's why the error was shown.

npx was running a cached copy of an earlier create-react-app version (4.0.1 in your original issue @peterbe) that then complained because it recognised there was a newer version available.

create-react-app/packages/create-react-app/createReactApp.js

Lines 204 to 211 in 8bf050a

    
           if (latest && semver.lt(packageJson.version, latest)) { 
        
             console.log(); 
        
             console.error( 
        
               chalk.yellow( 
        
                 `You are running \`create-react-app\` ${packageJson.version}, which is behind the latest release (${latest}).\n\n` + 
        
                   'We no longer support global installation of Create React App.' 
        
               ) 
        
             );

peterbe · 2021-02-24T16:57:12Z

You're right! I didn't even notice the You are running create-react-app 4.0.1, which is behind the latest release (4.0.3). line till now. Nuts.
I think I know why my brain didn't stop that. Because the prompt asked

Need to install the following packages:
  create-react-app
Ok to proceed? (y) y

So you're definitely thinking that this need to be installed and that it would use the latest and greatest.

I guess the mystery is; where and why is npx caching these things? npx --help doesn't state anything obvious. Perhaps I need to dig much deeper into how npm works and env vars or something. Sigh.

BenJenkinson · 2021-02-24T17:05:50Z

This same kind of issue has been reported several times now:

start fails right after create-react-app #10518 "start fails right after create-react-app"
Not working after update #10495 "Not working after update"
npx create-react-app is not working #10132 "npx create-react-app is not working"
Issues with running npx create-react-app on node 15.2.1 #10127 "Issues with running npx create-react-app on node 15.2.1"
npx create-react-app my-app is isn't installing the packages and i try uninstalling npm using -g but still. #10133 "npx create-react-app my-app is isn't installing the packages and i try uninstalling npm using -g but still"
error running npx create-react-app@next #9910 "error running npx create-react-app@next"

These were all ultimately resolved with either:

npx create-react-app@latest my-app

Or, in one case (#10495 (comment)), the exact opposite of what the error message tells you to do:

npm install -g create-react-app

npx create-react-app my-app

I suspect this is because the warning against "global" installs is really just checking for "is the version being run the latest version" which would be OK immediately after installing it globally, but then wouldn't be OK two weeks & two new versions later.

There are also a lot of solutions that suggest completely uninstalling and reinstalling node & npm, which I think is mostly a really dramatic way to ensure you have cleared npm's (and presumably npx's) cache of installed packages.

joselvelez · 2021-02-24T17:09:02Z

I just encountered this problem as well.

As a possible workaround, this worked for me:
npx create-react-app@latest my-app

Thanks! This worked for me.

peterbe · 2021-02-24T17:42:44Z

So a lot of people fall into this pitfall. Bummer. If we change the documentation to recommend using @latest, so many of those filed issues would go away. In a sense. Is that an interesting option?

BenJenkinson · 2021-02-24T17:54:14Z

I think there are two scenarios that can happen, and I think the error message is shown for both but the contents of the error message only apply to one of the scenarios.

The version of create-react-app run being out-of-date because it was installed globally
- ✅ show error message, instructions to uninstall globally apply
- ▶ Resolved with instructions in error message
The version of create-react-app run being out-of-date because it was cached by npx or npm init somewhere
- ❌ shows same error message, instructions don't help at all, lots of stuck people with issues
- ▶ Resolved by npx create-react-app@latest my-app

I also don't think it helps that the error message is so definitive about the global install being the only reason you're seeing the error (it's not checking for a global install after all, only checking if there's a newer version)

peterbe · 2021-02-24T18:10:51Z

Excellent! A solution could be to improve the error messaging to mention this thing about it being potentially cached. Because I don't have create-react-app installed globally so that part of the error wasn't helping me.
This idea actually feels more correct and less hacky that forcing that @latest thing should you shouldn't ultimately need to do.

A middle-ground option might be to mention some of these things, as a loud warning/note, in the documentation.
I still don't know what this create-react-app 4.0.1 is on my machine.

(Also, I hate that I now have 3 ways of running NPM packages: npm install -g, yarn global and npx)

fanjin-z · 2021-02-24T20:36:24Z

@BenJenkinson I can confirm that running out-of-date create-react-app version triggers this error.

I think it's very unreasonable to require latest release. Many companies requires developers to use internal npm repo, which is often a few days or weeks behind. I don't see the point forcing everyone to use up-to-date version, unless there's a severe security issue.

peterbe · 2021-02-24T20:45:34Z

I think it's very unreasonable to require latest release.

No one is saying that that is what you have to do. npx create-react-app my-app should work. That's what we're trying to figure out. What's next is to figure out if it's a matter of documentation, bug in the CLI, or improvements to the error messaging.

BenJenkinson · 2021-02-24T21:07:33Z

I think it's very unreasonable to require latest release.

@Fnjn I don't think the purpose was to force you to use a latest version.

As far as I understand, there are issues that can occur if you run create-react-app from a global install. So the check is meant to detect that scenario and the error is to explain why and how to correct it.

But the check was written to check for when you're not running the latest version (which would occur in a "global" scenario); presumably on the assumptions that npx/npm init would always fetch and run the latest version, and if you weren't using the latest version you must be running a "global" install.

I think the CLI bug is that that assumption is wrong. As we've seen, npx and npm init can sometimes use a cached version of create-react-app that is then not the latest version, which triggers the error, which then contains advice for a scenario that isn't happening.

So, where did the change come from?

💡 Proposal that spawned the change was: Add deprecation for global installs #7422 "Add deprecation for global installs"
▶ (merged) PR that introduced this was: feat: exit on outdated create-react-app version #9359 "feat: exit on outdated create-react-app version" by @mrmckeb

mrmckeb · 2021-02-25T08:49:50Z

I did some digging, and this may be an npm bug, as we did research this at the time and as I understood, both npx and yarn create use the latest version - using the cached version only if that is the latest version.

It looks like this is fixed in the latest releases of npm. If you can try that, and report back, that would be greatly appreciated!

This was the trail I took:

BenJenkinson · 2021-02-25T09:57:51Z

I'm sorry @mrmckeb, I assumed that npm's behaviour was intentional. I didn't think to look there for a cause! Thank you for digging!

So it looks like npm/cli#2597 has fixed "npx/npm init not using the latest version" in npm@7.5.2.

That would fit my own situation (because I was using npm@7.5.1), but looking at @peterbe's original log output, he was on npm@7.5.6 when he had this problem.

PaulB-H · 2021-02-25T10:09:24Z

Latest version of npm fixed it for me.

npm install -g npm@latest

then:
npx create-react-app myapp

~~asks: `Need to install the following packages: create-react-app Ok to proceed? (y)`~~

Running from terminal in VS code did not ask this, and seems to worked as usual.

mrmckeb · 2021-02-26T14:16:51Z

It's very much OK @BenJenkinson, that info wasn't easy to find - I'd obviously done that digging before which is why I was also confused.

Thanks for the update @PaulB-H. I'd recommend instead that you remove the global install for future, as you won't need it with npx :)

@peterbe is it OK if we close off this issue now? After you confirm that it now works of course :)

peterbe · 2021-02-26T17:07:12Z

@peterbe is it OK if we close off this issue now? After you confirm that it now works of course :)

Yeah. Sure. Part of me wishes the documentation or the error message could have done the kind of handholding I needed @BenJenkinson 's comment about using @latest.

And to be honest, I still don't know why my system thinks there's a create-react-app globally installed somewhere. I think I used to at some point when I originally discovered yarn global. (The evolution over the years has been: npm install -g, to yarn global, to npx)
For example, I still don't have it on my $PATH:

▶ create-react-app
zsh: command not found: create-react-app

But I still get the error every time:

/tmp
▶ npx create-react-app my-app003
Need to install the following packages:
  create-react-app
Ok to proceed? (y)

You are running `create-react-app` 4.0.1, which is behind the latest release (4.0.3).

We no longer support global installation of Create React App.

Please remove any global installs with one of the following commands:
- npm uninstall -g create-react-app
- yarn global remove create-react-app

The latest instructions for creating a new app can be found here:
https://create-react-app.dev/docs/getting-started/

So the message "You are running create-react-app 4.0.1," is a bit baffling. I don't think this could be possible to get on a fresh new computer or container where you haven't gone through the old global install tools that have all been replaced with npx.

Actually, I still have no idea where this create-react-app@4.0.1 is on my machine.
I do have:

▶ ls -l ~/.npm/create-react-app
total 0
drwxr-xr-x  4 peterbe  staff  128 Feb  6  2018 0.2.0
drwxr-xr-x  4 peterbe  staff  128 Oct  1  2016 0.5.0
drwxr-xr-x  4 peterbe  staff  128 Feb  6  2018 1.0.0

But perhaps my system is just too screwed up to hold back the great work of create-react-app and people's time on this debugging.

JosephCanete · 2021-04-02T13:50:33Z

I just encountered this problem as well.

As a possible workaround, this worked for me:
npx create-react-app@latest my-app

This works for me!

Barani2396 · 2021-04-16T00:13:49Z

Hi,

I have tried all of the solutions but this worked for me - leaving the npm/npx and only using create-react-app my-app cmd ignores the error You are running 'create-react-app' 4.0.2, which is behind the latest release (4.0.3). and builds the project file.

Hope this would be helpful!

evank21 · 2021-05-06T22:52:23Z

Latest version of npm fixed it for me.

npm install -g npm@latest

then:
npx create-react-app myapp
asks: Need to install the following packages: create-react-app Ok to proceed? (y)

Running from terminal in VS code did not ask this, and seems to worked as usual.

Perfect, this works. Thank you!

daffriedman · 2021-05-27T13:49:46Z

Thank you evank21 I also had the above issue and what you said worked for me

tarikelhady · 2021-06-14T08:58:04Z

just update npx to latest version =>
npm update npx

Ashraf840 · 2021-06-24T21:51:32Z

This helps me to restart my react app. A reasonable workaround while I'm still learning React.

Update - I went into the package.json and changed the react-scripts to 4.0.1 and typed npm install(terminal) and re-ran it and it fixed the issue. Hope this helps.

I have tried uninstalling the create-react-app from the global scope, even re-install the nodejs & npm completely. I'm learning React in Centos Stream 8. Then use npx create-react-app my-app, but nothing solved the issue of failing to start the react app. Then I followed the solution in the link.

It seems I have to manually change the version of react-scripts from 4.0.3 to 4.0.1 inside the "package.json" file of the react-app directory.

"react": "^17.0.2",
"react-dom": "^17.0.2",
"react-scripts": "4.0.1", <<<<
"web-vitals": "^1.1.2"

Then run the command: npm install in the project's current directory,
finally re-run the react app using npm start.

Hope that works for you all until the issue is fixed!

haraldrudell · 2021-07-26T08:31:39Z

This still buggy at create-react-app@4.0.3 by npx@7.18.1 which seems to come with node@16.4.1

Get around is to install create-react-app in separate project that can later be deleted.

In you parent directory:

mkdir cra
cd cra
yarn init --yes
yarn add create-react-app
cd ..
./cra/node_modules/.bin/create-react-app <my-app-name>
rm -r cra
cd <my-app-name>
yarn start

argahsuknesib · 2021-12-14T20:45:03Z

I just encountered this problem as well.

As a possible workaround, this worked for me:
npx create-react-app@latest my-app

Thanks! It worked.

Yashkapure06 · 2021-12-15T04:50:38Z

I just encountered this problem as well.

As a possible workaround, this worked for me:
npx create-react-app@latest my-app

Thank you Sir! It helped

vugartaghiyev · 2021-12-19T12:43:27Z

Hi,

npm uninstall -g create-react-app
npm i -g create-react-app
npx create-react-app appname

It works for me.

maximarsoficial · 2021-12-21T14:33:38Z

Also what one can do is enter the console as administrator, located in the user's folder, and put this command (in my case I used the NPM one)

npm uninstall -g create-react-app

we uninstall it and then I reinstall it

npm install -g create-react-app

and voila, it worked for me

Rishikesh-kumar-7258 · 2021-12-22T08:21:40Z

Also what one can do is enter the console as administrator, located in the user's folder, and put this command (in my case I used the NPM one)

npm uninstall -g create-react-app

we uninstall it and then I reinstall it

npm install -g create-react-app

and voila, it worked for me

It is not working for me...
I have tried many things on net.
searched StackOverflow and also here but nothing till now

cna-so · 2021-12-25T09:42:12Z

I just encountered this problem as well.

As a possible workaround, this worked for me:
npx create-react-app@latest my-app

this is work and can somebody say why?

drustin2 · 2021-12-28T23:49:28Z

So for anyone on windows - I actually had to go to Add/Remove Programs and remove NVM from there

Doing that and the commands above after a fresh npm install everything worked.

liuliangsir · 2021-12-30T12:00:25Z

@drustin2 give more details?

HansBrende · 2022-02-14T01:23:08Z

npx clear-npx-cache fixed the issue for me: I no longer have to specify @latest to get the command to work. Should work as long as your npm version is >= 7.5.2, I believe.

mwisnicki · 2022-03-21T05:22:43Z

Actual workaround to use non-latest version: #12022 (comment)

frankiefab100 · 2022-04-13T15:19:53Z

I just encountered this problem as well.

As a possible workaround, this worked for me:
npx create-react-app@latest my-app

Thank you, this works.

I think everyone will experience this each time a new version of React is released.

CallmeKelly · 2022-10-25T18:50:17Z

I Have been experiencing this issues and i need help on how to install react on my vs code

                                                              👇👇👇


                                PS C:\Users\acer\Desktop\app> npx create-react-app

Need to install the following packages:
create-react-app@5.0.1
Ok to proceed? (y) Ok
npm ERR! canceled

npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\acer\AppData\Local\npm-cache_logs\2022-10-25T18_45_31_636Z-debug-0.log

THIS IS THE ERROR MESSAGE I HAVE BEEN GETTING!!!😢😢😢

evank21 · 2022-10-25T19:19:21Z

@CallmeKelly can you confirm when you see the line Ok to proceed in the console, are you entering Ok? You should be responding with y.

peterbe added issue: bug report needs triage labels Feb 23, 2021

peterbe mentioned this issue Feb 23, 2021

facing issue while creating-react-app #10582

Closed

burntcarrot mentioned this issue Feb 26, 2021

React npm start failing on out of the box code. #10614

Closed

SrBrahma mentioned this issue Apr 24, 2021

[BUG] npx does not attempt to get newer versions npm/cli#2329

Closed

fahadfa mentioned this issue May 24, 2021

jazeerapaints #10668

Closed

HansBrende mentioned this issue Feb 14, 2022

We no longer support global installation of Create React App #12022

Open

"npx create-react-app my-app" stopped working in 4.0.3 #10601

"npx create-react-app my-app" stopped working in 4.0.3 #10601

Comments

peterbe commented Feb 23, 2021

Describe the bug

Did you try recovering your dependencies?

Which terms did you search for in User Guide?

Environment

Steps to reproduce

Expected behavior

Actual behavior

Reproducible demo

peterbe commented Feb 23, 2021

Sverxsro4nik commented Feb 23, 2021

BenJenkinson commented Feb 24, 2021

Sverxsro4nik commented Feb 24, 2021

peterbe commented Feb 24, 2021

BenJenkinson commented Feb 24, 2021 • edited Loading

peterbe commented Feb 24, 2021

BenJenkinson commented Feb 24, 2021 • edited Loading

joselvelez commented Feb 24, 2021

peterbe commented Feb 24, 2021

BenJenkinson commented Feb 24, 2021 • edited Loading

peterbe commented Feb 24, 2021

fanjin-z commented Feb 24, 2021 • edited Loading

peterbe commented Feb 24, 2021 • edited Loading

BenJenkinson commented Feb 24, 2021 • edited Loading

So, where did the change come from?

mrmckeb commented Feb 25, 2021

BenJenkinson commented Feb 25, 2021

PaulB-H commented Feb 25, 2021 • edited Loading

mrmckeb commented Feb 26, 2021

peterbe commented Feb 26, 2021

JosephCanete commented Apr 2, 2021

Barani2396 commented Apr 16, 2021 • edited Loading

evank21 commented May 6, 2021

daffriedman commented May 27, 2021

tarikelhady commented Jun 14, 2021

Ashraf840 commented Jun 24, 2021 • edited Loading

This helps me to restart my react app. A reasonable workaround while I'm still learning React.

haraldrudell commented Jul 26, 2021

argahsuknesib commented Dec 14, 2021

Yashkapure06 commented Dec 15, 2021

Thank you Sir! It helped

vugartaghiyev commented Dec 19, 2021

maximarsoficial commented Dec 21, 2021

Rishikesh-kumar-7258 commented Dec 22, 2021

cna-so commented Dec 25, 2021

drustin2 commented Dec 28, 2021 • edited Loading

liuliangsir commented Dec 30, 2021

HansBrende commented Feb 14, 2022

mwisnicki commented Mar 21, 2022

frankiefab100 commented Apr 13, 2022

CallmeKelly commented Oct 25, 2022

evank21 commented Oct 25, 2022

BenJenkinson commented Feb 24, 2021 •

edited

Loading

BenJenkinson commented Feb 24, 2021 •

edited

Loading

BenJenkinson commented Feb 24, 2021 •

edited

Loading

fanjin-z commented Feb 24, 2021 •

edited

Loading

peterbe commented Feb 24, 2021 •

edited

Loading

BenJenkinson commented Feb 24, 2021 •

edited

Loading

PaulB-H commented Feb 25, 2021 •

edited

Loading

Barani2396 commented Apr 16, 2021 •

edited

Loading

Ashraf840 commented Jun 24, 2021 •

edited

Loading

drustin2 commented Dec 28, 2021 •

edited

Loading