React.JS App MODULE_NOT_FOUND error on 'npm start'

Question

I have a problem with React.js.

After creating a react application, when I run the command npm start I have the following error:

PS G:\workspace\WEB\gab-web\client> npm start

> [email protected] start G:\workspace\WEB\gab-web\client
> react-scripts start

internal/modules/cjs/loader.js:628
  throw e;
  ^

Error: No valid exports main found for 'G:\workspace\WEB\gab-web\client\node_modules\postcss-safe-parser\node_modules\postcss'
    at resolveExportsTarget (internal/modules/cjs/loader.js:625:9)
    at applyExports (internal/modules/cjs/loader.js:502:14)
    at resolveExports (internal/modules/cjs/loader.js:551:12)
    at Function.Module._findPath (internal/modules/cjs/loader.js:657:22)
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:960:27)
    at Function.Module._load (internal/modules/cjs/loader.js:855:27)
    at Module.require (internal/modules/cjs/loader.js:1033:19)
    at require (internal/modules/cjs/helpers.js:72:18)
    at Object.<anonymous> (G:\workspace\WEB\gab-web\client\node_modules\postcss-safe-parser\lib\safe-parse.js:1:17)
    at Module._compile (internal/modules/cjs/loader.js:1144:30) {
  code: 'MODULE_NOT_FOUND'
}
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] start: `react-scripts start`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] 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\gabri\AppData\Roaming\npm-cache\_logs\2021-01-10T19_26_53_509Z-debug.log

And here's the full log file :

0 info it worked if it ends with ok
1 verbose cli [
1 verbose cli   'C:\\Program Files\\nodejs\\node.exe',
1 verbose cli   'C:\\Program Files\\nodejs\\node_modules\\npm\\bin\\npm-cli.js',
1 verbose cli   'start'
1 verbose cli ]
2 info using [email protected]
3 info using [email protected]
4 verbose run-script [ 'prestart', 'start', 'poststart' ]
5 info lifecycle [email protected]~prestart: [email protected]
6 info lifecycle [email protected]~start: [email protected]
7 verbose lifecycle [email protected]~start: unsafe-perm in lifecycle true
8 verbose lifecycle [email protected]~start: PATH: C:\Program Files\nodejs\node_modules\npm\node_modules\npm-lifecycle\node-gyp-bin;G:\workspace\WEB\gab-web\client\node_modules\.bin;C:\Program Files (x86)\Common Files\Intel\Shared Libraries\redist\intel64\compiler;C:\Program Files (x86)\Common Files\Oracle\Java\javapath;C:\Windows\system32;C:\Windows;C:\Windows\System32\Wbem;C:\Windows\System32\WindowsPowerShell\v1.0\;C:\Windows\System32\OpenSSH\;C:\Program Files (x86)\NVIDIA Corporation\PhysX\Common;C:\Users\gabri\.dnx\bin;C:\Program Files\Microsoft DNX\Dnvm\;C:\Program Files\Microsoft SQL Server\130\Tools\Binn\;C:\Program Files\NVIDIA Corporation\NVIDIA NvDLISR;C:\Program Files\dotnet\;C:\WINDOWS\system32;C:\WINDOWS;C:\WINDOWS\System32\Wbem;C:\WINDOWS\System32\WindowsPowerShell\v1.0\;C:\WINDOWS\System32\OpenSSH\;C:\Program Files\Java\jdk1.8.0_221\bin;C:\Program Files\WorldPainter;C:\Program Files\nodejs\;C:\Program Files\Git\cmd;C:\Users\gabri\AppData\Local\Programs\Python\Python38-32\Scripts\;C:\Users\gabri\AppData\Local\Programs\Python\Python38-32\;C:\Users\gabri\AppData\Local\Microsoft\WindowsApps;C:\Users\gabri\AppData\Roaming\Dashlane\6.1937.0.23352\bin\Firefox_Extension\{442718d9-475e-452a-b3e1-fb1ee16b8e9f}\components;C:\Users\gabri\AppData\Roaming\Dashlane\6.1937.0.23352\ucrt;C:\Users\gabri\AppData\Roaming\Dashlane\6.1937.0.23352\bin\Qt;C:\Users\gabri\AppData\Roaming\Dashlane\6.1937.0.23352\bin\Ssl;C:\Users\gabri\AppData\Roaming\npm;D:\workspace\ffmpeg\bin;C:\Users\gabri\AppData\Local\atom\bin;C:\Users\gabri\AppData\Local\Programs\Microsoft VS Code\bin;C:\Users\gabri\AppData\Local\Microsoft\WindowsApps;C:\Users\gabri\AppData\Local\GitHubDesktop\bin
9 verbose lifecycle [email protected]~start: CWD: G:\workspace\WEB\gab-web\client
10 silly lifecycle [email protected]~start: Args: [ '/d /s /c', 'react-scripts start' ]
11 silly lifecycle [email protected]~start: Returned: code: 1  signal: null
12 info lifecycle [email protected]~start: Failed to exec start script
13 verbose stack Error: [email protected] start: `react-scripts start`
13 verbose stack Exit status 1
13 verbose stack     at EventEmitter.<anonymous> (C:\Program Files\nodejs\node_modules\npm\node_modules\npm-lifecycle\index.js:332:16)
13 verbose stack     at EventEmitter.emit (events.js:321:20)
13 verbose stack     at ChildProcess.<anonymous> (C:\Program Files\nodejs\node_modules\npm\node_modules\npm-lifecycle\lib\spawn.js:55:14)
13 verbose stack     at ChildProcess.emit (events.js:321:20)
13 verbose stack     at maybeClose (internal/child_process.js:1028:16)
13 verbose stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:286:5)
14 verbose pkgid [email protected]
15 verbose cwd G:\workspace\WEB\gab-web\client
16 verbose Windows_NT 10.0.19042
17 verbose argv "C:\\Program Files\\nodejs\\node.exe" "C:\\Program Files\\nodejs\\node_modules\\npm\\bin\\npm-cli.js" "start"
18 verbose node v13.6.0
19 verbose npm  v6.13.4
20 error code ELIFECYCLE
21 error errno 1
22 error [email protected] start: `react-scripts start`
22 error Exit status 1
23 error Failed at the [email protected] start script.
23 error This is probably not a problem with npm. There is likely additional logging output above.
24 verbose exit [ 1, true ]

I have tried a few things found on the internet but still haven't found a solution to my problem. Thank you ;p

Answer 1

Try upgrading your npm to v14.5 or later, also remove react-create-app globally:

npm uninstall -g create-react-app

and then try recreating your project:

npx create-react-app myapp

It's a known issue, credits: https://github.com/facebook/create-react-app/issues/9273#issuecomment-654182223

Answer 2

I have faced this issue during installing node js on my system so i have tried to change the directory ( File installation ) for node js & it works...

Changed Destination:-

C:\JAVA\