create-react-app 后无法启动项目：错误：找不到模块“C:\Users\pcname\Documents\react-scripts\bin\react-scripts.js”

Question

I created a small react project using npx create-react-app to work on some react tutorials but I am unable to start the react app. This i the error that I get when trying to run the project:

> test-app@0.1.0 start C:\Users\pcname\Documents\React R&D\Pluralsight\test-app
> react-scripts start

'D\Pluralsight\test-app\node_modules\.bin\' is not recognized as an internal or external command,
operable program or batch file.
internal/modules/cjs/loader.js:983
  throw err;
  ^

Error: Cannot find module 'C:\Users\pcname\Documents\react-scripts\bin\react-scripts.js'
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:980:15)
    at Function.Module._load (internal/modules/cjs/loader.js:862:27)
    at Function.executeUserEntryPoint [as runMain] (internal/modules/run_main.js:74:12)
    at internal/main/run_main_module.js:18:47 {
  code: 'MODULE_NOT_FOUND',
  requireStack: []
}
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! test-app@0.1.0 start: `react-scripts start`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the test-app@0.1.0 start script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\pcnmame\AppData\Roaming\npm-cache\_logs\2020-04-08T22_43_14_881Z-debug.log

I've uninstalled node, reinstalled it. Install react-scripts globally and not globally. I've replaced the start script in the package.json to be:

"start": "node node_modules/react-scripts/scripts/start.js"

and that works. I've also run react-scripts start inside the app folder and again, that works!! But I can't get it to work when I do npm start inside the app folder

Bonus: Any tutorials setting up React in Visual Studio (not vs code) without using ASP NET Core would be appreciated. I'm currently unable to set up the debugger with VS.

Answer 1

This error can happen after you use create-react-app in case you have some invalid character in your path.

Remove & from your path.

Change from this:

C:\Users\pcname\Documents\React R&D\Pluralsight\test-app

To this:

C:\Users\pcname\Documents\React RD\Pluralsight\test-app

It should work now!

Answer 2

re-running npm i solved my problem. I had the same problem, turns out "reinstalling" npm packages gets rid of the annoying

Error: Cannot find module 'C:\Users\pcname\Documents\react-scripts\bin\react-scripts.js'. . . { code: 'MODULE_NOT_FOUND', requireStack: [] }

error message.

Answer 3

i am facing this error, can anyone please help me to get ride of it please !!!

Your environment has been set up for using Node.js 17.9.0 (x64) and npm.

C:\Users\lpy> cd desktop

C:\Users\lpy\Desktop>npx react-native init cws --version 0.68.2 node:internal/modules/cjs/loader:361 throw err; ^

Error: Cannot find module 'C:\Users\lpy\AppData\Local\npm-cache_npx\7930a8670f922cdb\node_modules\absolute-path\index.js'. Please verify that the package.json has a valid "main" entry at tryPackage (node:internal/modules/cjs/loader:353:19) at Function.Module._findPath (node:internal/modules/cjs/loader:566:18) at Function.Module._resolveFilename (node:internal/modules/cjs/loader:919:27) at Function.Module._load (node:internal/modules/cjs/loader:778:27) at Module.require (node:internal/modules/cjs/loader:999:19) at require (node:internal/modules/cjs/helpers:102:18) at Object. (C:\Users\lpy\AppData\Local\npm-cache_npx\7930a8670f922cdb\node_modules@react-native-community\cli\node_modules\metro-resolver\src\resolve.js:20:24) at Module._compile (node:internal/modules/cjs/loader:1099:14) at Object.Module._extensions..js (node:internal/modules/cjs/loader:1153:10) at Module.load (node:internal/modules/cjs/loader:975:32) { code: 'MODULE_NOT_FOUND', path: 'C:\Users\lpy\AppData\Local\npm-cache\_npx\7930a8670f922cdb\node_modules\absolute-path\package.json', requestPath: 'absolute-path' }

Node.js v17.9.0