Npx Create-react-app demo - react-scripts.js path error

[TheCoderJT]

I decided to try and learn react and was following the instructions listed here https://reactjs.org/docs/create-a-new-react-app.html. So I made a folder opened it in vscode, went into my bash terminal and ran the below code as instructed.

npx create-react-app demo once completed then cd'ed into my demo folder

cd demo and then typed npm start and this is where I get this bug

npm start

error:

PersonalInfo@DESKTOP-C0M5IPI MINGW64 /f/1.Web Development/Tutorials&Courses/Devslopes/learn-react/demo-app (master)
$ npm start

> demo-app@0.1.0 start
> react-scripts start

'Courses\Devslopes\learn-react\demo-app\node_modules\.bin\' is not recognized as an internal or external command,
operable program or batch file.
internal/modules/cjs/loader.js:883
  throw err;
  ^

Error: Cannot find module 'F:\1.Web Development\react-scripts\bin\react-scripts.js'
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:880:15)
    at Function.Module._load (internal/modules/cjs/loader.js:725:27)
    at Function.executeUserEntryPoint [as runMain] (internal/modules/run_main.js:72:12)
    at internal/main/run_main_module.js:17:47 {
  code: 'MODULE_NOT_FOUND',
  requireStack: []
}

I have node.js and npm installed globally and i'm sure the npx create-react-app installs node locally to the folder. I'm at a loss here, even went inside discord and asked for help in various channels and people also don't know whats going on here.

Upon further inspection it seems that inside the error its for some reason trying to locate the node module from this directory which is weird F:\1.Web Development\react-scripts\bin\react-scripts.js

because I ran npx create-react-app demo in this directory /f/1.Web Development/Tutorials&Courses/Devslopes/learn-react/ and then cd into demo. and ran npm start and this gives me the above error.

It should be looking for the node module react-scripts.js inside this dir: _F:\1.Web Development\Tutorials&Courses/Devslopes/learn-react/demo/nodemodules/react-scripts/bin/react-scripts.js

React version: what ever version gets loaded with npx create-react-app demo command

Steps To Reproduce

I just created a main folder inside my other folders called learn-react opened that in visual code and then followed the guide for npx create-react-app demo and then followed the next instructions once i got to the npm start or npm run start tried both commands and it results is said error.

I tried switching terminal and used default powershell in vscode and still same error. I'm not sure what happened cause like i said above was using npm to install packages all day today and then when i wanted to learn react this is happening to me...

google drive video: https://drive.google.com/file/d/1bYmT--iQ49ymJ2co0S6YGxBksmVXvCbL/view?usp=sharing

[TheCoderJT]

Update: Found the solution: https://github.com/facebook/create-react-app/issues/3594 very bottom of post @vikbi says to;

Add this path C:\Users\vchaudhari\AppData\Roaming\npm. to your system environment variables

Remember to replace your ^ ^ with your username..

I did and now no error and it works...

I feel react devs should mention the above on this page https://reactjs.org/docs/create-a-new-react-app.html

[marko-hologram]

Update: Found the solution: #3594 very bottom of post @vikbi says to;

Add this path C:\Users\vchaudhari\AppData\Roaming\npm. to your system environment variables

Remember to replace your ^ ^ with your username..

I did and now no error and it works...

I feel react devs should mention the above on this page https://reactjs.org/docs/create-a-new-react-app.html

I'm not sure if it would be helpful to include that in any docs since it's (probably) not a common issue. It might be some issue with your npm installation if you had to manually add npm to PATH.