I have latest version of node and vs code installed. I can easily install node modules but it wont start and deploy to host 3000.
Here is the error.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents#1.2.13 (node_modules\webpack-dev-server\node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents#1.2.13: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents#1.2.13 (node_modules\watchpack-chokidar2\node_modules\fsevents):
Starting the development server...
events.js:377
throw er; // Unhandled 'error' event
^
Error: spawn powershell ENOENT
at Process.ChildProcess._handle.onexit (internal/child_process.js:274:19)
at onErrorNT (internal/child_process.js:469:16)
at processTicksAndRejections (internal/process/task_queues.js:82:21)
Emitted 'error' event on ChildProcess instance at:
at Process.ChildProcess._handle.onexit (internal/child_process.js:280:12)
at onErrorNT (internal/child_process.js:469:16)
at processTicksAndRejections (internal/process/task_queues.js:82:21) {
errno: -4058,
code: 'ENOENT',
syscall: 'spawn powershell',
path: 'powershell',
spawnargs: [
'-NoProfile',
'-NonInteractive',
'–ExecutionPolicy',
'Bypass',
'-EncodedCommand',
'UwB0AGEAcgB0ACAAIgBgACIAaAB0AHQAcAA6AC8ALwBsAG8AYwBhAGwAaABvAHMAdAA6ADMAMAAwADAAYAAiACIA'
]
}
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! reminder#0.1.0 start: `react-scripts start`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the reminder#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:
Im uncertain if my package.json is to blaim for the dom not deplying so here is that code below as well. let me know if you need anything additional as well. Again I dont know why it isnt automatically opening up to host 3000 and rendering things to the dom?
{
"name": "reminder",
"version": "0.1.0",
"private": true,
"dependencies": {
"#testing-library/jest-dom": "^4.2.4",
"#testing-library/react": "^9.5.0",
"#testing-library/user-event": "^7.2.1",
"react": "^16.13.1",
"react-dom": "^16.13.1",
"react-icons": "^3.11.0",
"react-scripts": "3.4.3"
},
"scripts": {
"start": "react-scripts start",
"build": "CI= react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": "react-app"
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
}
}
solved here, watch the video below and he solved it for me. not affiliated
https://www.youtube.com/watch?v=1sFH30JjB6E
Related
When trying to install material ui get a load of dependency resolution errors. Not quite sure what the cause is. I previously tried to install V4 and got an error, that I thought I would resolve by using V5 because this version of React isn't compatible with V4 but I have no idea about the rest of the conflicts.
npm i #mui/material #emotion/react #emotion/styled
npm ERR! code ERESOLVE
npm ERR! ERESOLVE could not resolve
npm ERR!
npm ERR! While resolving: #material-ui/core#4.12.4
npm ERR! Found: react#18.2.0
npm ERR! node_modules/react
npm ERR! peer react#"^18.0.0" from #testing-library/react#13.3.0
npm ERR! node_modules/#testing-library/react
npm ERR! dev #testing-library/react#"^13.3.0" from the root project
npm ERR! peer react#">=16" from phosphor-react#1.4.1
npm ERR! node_modules/phosphor-react
npm ERR! dev phosphor-react#"^1.4.1" from the root project
npm ERR! 18 more (react-dom, react-dropzone, react-media, react-popper, ...)
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react#"^16.8.0 || ^17.0.0" from #material-ui/core#4.12.4
npm ERR! node_modules/#material-ui/core
npm ERR! #material-ui/core#"^4.12.4" from the root project
npm ERR!
npm ERR! Conflicting peer dependency: react#17.0.2
npm ERR! node_modules/react
npm ERR! peer react#"^16.8.0 || ^17.0.0" from #material-ui/core#4.12.4
npm ERR! node_modules/#material-ui/core
npm ERR! #material-ui/core#"^4.12.4" from the root project
npm ERR!
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
package.json:
{
"name": "wordscramble",
"version": "0.1.0",
"private": true,
"dependencies": {
"#material-ui/core": "^4.12.4",
"#testing-library/jest-dom": "^5.16.4",
"#testing-library/user-event": "^13.5.0",
"bootstrap": "^5.2.0",
"jquery": "^3.6.1",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-dropzone": "^14.2.2",
"react-media": "^1.10.0",
"react-router": "^6.3.0",
"react-scripts": "5.0.1",
"react-tinder-card": "^1.4.5",
"reactstrap": "^9.1.2",
"web-vitals": "^2.1.4"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": [
"react-app",
"react-app/jest"
]
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
},
"devDependencies": {
"#testing-library/react": "^13.3.0",
"fetch-mock": "^9.11.0",
"msw": "^0.44.2",
"phosphor-react": "^1.4.1",
"react-redux": "^8.0.2",
"react-router-dom": "^6.3.0",
"react-test-renderer": "^18.2.0"
}
}
Any help in identifying any potential conflicts would be greatly appreciated,
thanks!
1- uninstall #material-ui :
npm uninstall #material-ui/core
2 - install Mui v5 :
npm install #mui/material #mui/styled-engine-sc styled-components
Works with --legacy-peer-deps:
npm i #mui/material #emotion/react #emotion/styled --legacy-peer-deps
For more details see react v17 section on this answer https://stackoverflow.com/a/66620869/1515819
npm install is failing with the below message. I tried deleting the node_modules folder and installing it again, but it didn't work:
15104 error command sh -c node-gyp-build
15105 error sh: node-gyp-build: command not found
How can I solve this?
Error log of npm install --verbose:
npm ERR! code 127
npm ERR! path /Users/johnnycheng/Documents/React Projects/blockchain:fintech/coin-web-test2/node_modules/utf-8-validate
npm ERR! command failed
npm ERR! command sh -c node-gyp-build
npm ERR! sh: node-gyp-build: command not found
npm verb exit 127
npm timing npm Completed in 30755ms
npm verb unfinished npm timer reify 1650620386080
npm verb unfinished npm timer reify:build 1650620407577
npm verb unfinished npm timer build 1650620407582
npm verb unfinished npm timer build:deps 1650620407583
npm verb unfinished npm timer build:run:install 1650620407669
npm verb unfinished npm timer build:run:install:node_modules/bufferutil 1650620407670
npm verb unfinished npm timer build:run:install:node_modules/utf-8-validate 1650620407692
npm verb code 127
npm ERR! A complete log of this run can be found in:
npm ERR! /Users/johnnycheng/.npm/_logs/2022-04-22T09_39_45_773Z-debug-0.log
File package.json of my project:
{
"name": "coin-web-test2",
"version": "0.1.0",
"private": true,
"dependencies": {
"#emotion/react": "^11.9.0",
"#emotion/styled": "^11.8.1",
"#fontsource/roboto": "^4.5.5",
"#mui/material": "^5.6.2",
"#testing-library/jest-dom": "^5.14.1",
"#testing-library/react": "^13.0.0",
"#testing-library/user-event": "^13.2.1",
"crypto-js": "^3.1.9-1",
"ethers": "^5.6.4",
"react": "^18.0.0",
"react-dom": "^18.0.0",
"react-router-dom": "^6.3.0",
"react-scripts": "4.0.3",
"web-vitals": "^2.1.0",
"web3": "^1.7.3"
},
"scripts": {
"start": "NODE_ENV=production node_modules/react-scripts/bin/react-scripts.js start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": [
"react-app",
"react-app/jest"
]
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
}
}
Check the full error log here: Full error log
Environment: macOS v12.3.1 (Monterey)
Node.js version: 16.14.2
npm version: 8.7.0
Running yarn install and then npm install somehow works.
I don't any idea how.
Try installing using this command as follows:
npm install node-gyp
I can't find node-gyp module in your package.json file.
Try running npm install node-gyp and following the instructions for node-gyp module npm link.
npm install #mui/x-data-grid
throws an error
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: highradius#0.1.0
npm ERR! Found: react#18.0.0
npm ERR! node_modules/react
npm ERR! react#"^18.0.0" from the root project
npm ERR! peer react#"^17.0.0 || ^18.0.0" from #mui/material#5.6.0
npm ERR! node_modules/#mui/material
npm ERR! #mui/material#"^5.6.0" from the root project
npm ERR! peer #mui/material#"^5.2.8" from #mui/x-data-grid#5.8.0
npm ERR! node_modules/#mui/x-data-grid
npm ERR! #mui/x-data-grid#"*" from the root project
npm ERR! 4 more (#emotion/react, #emotion/styled, react-dom, #mui/system)
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react#"^17.0.2" from #mui/x-data-grid#5.8.0
npm ERR! node_modules/#mui/x-data-grid
npm ERR! #mui/x-data-grid#"*" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR! See C:\Users\01kar\AppData\Local\npm-cache\eresolve-report.txt for a full report.
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\01kar\AppData\Local\npm-cache\_logs\2022-04-06T12_50_46_543Z-debug-0.log
What I think is that there is some version mismatch in the dependencies.
New to react so can't understand the dependencies. Please give a step by step process to resolve this error.
{
"name": "highradius",
"version": "0.1.0",
"private": true,
"dependencies": {
"#emotion/react": "^11.9.0",
"#emotion/styled": "^11.8.1",
"#mui/base": "^5.0.0-alpha.75",
"#mui/material": "^5.6.0",
"#testing-library/jest-dom": "^5.16.3",
"#testing-library/react": "^12.1.4",
"#testing-library/user-event": "^13.5.0",
"react": "^18.0.0",
"react-dom": "^18.0.0",
"react-scripts": "5.0.0",
"web-vitals": "^2.1.4"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": [
"react-app",
"react-app/jest"
]
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
}
}
This is the package.json file.
I tried installing npm install #mui/material #emotion/react #emotion/styled and it was installed successfully now I am trying to install data grid but its showing me this error.
npm i #mui/x-data-grid --legacy-peer-deps
Installing using this solved the issue for me.
Based on #mui/x-data-grid's documentation, it looks like this snippet of code should fix this issue
"peerDependencies": {
"#mui/material": "^5.0.0",
"react": "^17.0.0"
},
add --legacy-peer-deps at the end of your npm command like below 👇
npm i #mui/x-data-grid --legacy-peer-deps
try npm install #mui/x-data-grid --legacy-peer-deps and it will work fine.
when I tried to install firebase it always fails. I wanna to install firebase in my REACTJS project using
`npm i firebase`
and shows this error:
npm WARN tsutils#3.17.1 requires a peer of typescript#>=2.8.0 || >= 3.2.0-dev || >= 3.3.0-dev || >= 3.4.0-dev || >= 3.5.0-dev || >= 3.6.0-dev || >= 3.6.0-beta || >= 3.7.0-dev || >= 3.7.0-beta but none is installed. You must install peer dependencies yourself.
npm ERR! code EPERM
npm ERR! syscall unlink
npm ERR! path G:\react\netflix\netflix-clone\node_modules\youtube-player\node_modules\debug\src
npm ERR! errno -4048
npm ERR! Error: EPERM: operation not permitted, unlink 'G:\react\netflix\netflix-clone\node_modules\youtube-player\node_modules\debug\src'
npm ERR! [OperationalError: EPERM: operation not permitted, unlink 'G:\react\netflix\netflix-clone\node_modules\youtube-player\node_modules\debug\src'] {
npm ERR! cause: [Error: EPERM: operation not permitted, unlink 'G:\react\netflix\netflix-clone\node_modules\youtube-player\node_modules\debug\src'] {
npm ERR! errno: -4048,
npm ERR! code: 'EPERM',
npm ERR! syscall: 'unlink',
npm ERR! path: 'G:\react\netflix\netflix-clone\node_modules\youtube-player\node_modules\debug\src'
npm ERR! },
npm ERR! errno: -4048,
npm ERR! code: 'EPERM',
npm ERR! syscall: 'unlink',
npm ERR! path: 'G:\react\netflix\netflix-clone\node_modules\youtube-player\node_modules\debug\src',
npm ERR! parent: 'youtube-player'
npm ERR! }
npm ERR!
npm ERR! The operation was rejected by your operating system.
npm ERR! It's possible that the file was already in use (by a text editor or antivirus),
npm ERR! or that you lack permissions to access it.
npm ERR!
npm ERR! If you believe this might be a permissions issue, please double-check the
npm ERR! permissions of the file and its containing directories, or try running
npm ERR! the command again as root/Administrator.
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\ADMIN\AppData\Roaming\npm-cache_logs\2020-09-20T07_03_09_714Z-debug.log
my package.json file is here :
{
"name": "netflix-clone",
"version": "0.1.0",
"private": true,
"dependencies": {
"#testing-library/jest-dom": "^4.2.4",
"#testing-library/react": "^9.5.0",
"#testing-library/user-event": "^7.2.1",
"axios": "^0.20.0",
"movie-trailer": "^2.0.6",
"react": "^16.13.1",
"react-dom": "^16.13.1",
"react-scripts": "3.4.3",
"react-youtube": "^7.12.0"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": "react-app"
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
}
}
This might be a permission issue.
What you can do is that open command line(CMD) as an administrator by right clicking on command line(CMD) and selecting "Run as Administrator".
Once it is opened then navigate to your project folder and then install firebase. Image is added for windows but if you have MAC then do it correspondingly!
Please what does this error mean:
errno: 'ENOENT',
code: 'ENOENT',
syscall: 'spawn cmd',
path: 'cmd',
spawnargs: [ '/s', '/c', 'start', '""', '/b', '"http://localhost:3000/"' ]
I get the error anytime I run NPM START in my VSCode React Project.
It is a fresh installation of create-react-app. It is supposed to start at first run. Kindly help look into the Package.json file:
{
"name": "test-app",
"version": "0.1.0",
"private": true,
"dependencies": {
"#testing-library/jest-dom": "^4.2.4",
"#testing-library/react": "^9.5.0",
"#testing-library/user-event": "^7.2.1",
"react": "^16.13.1",
"react-dom": "^16.13.1",
"react-scripts": "3.4.1"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": "react-app"
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
}
}
This is the full error from vscode console:
events.js:288
throw er; // Unhandled 'error' event
^
Error: spawn cmd ENOENT
at Process.ChildProcess._handle.onexit (internal/child_process.js:267:19)
at onErrorNT (internal/child_process.js:469:16)
at processTicksAndRejections (internal/process/task_queues.js:84:21)
Emitted 'error' event on ChildProcess instance at:
at Process.ChildProcess._handle.onexit (internal/child_process.js:273:12)
at onErrorNT (internal/child_process.js:469:16)
at processTicksAndRejections (internal/process/task_queues.js:84:21) {
errno: 'ENOENT',
code: 'ENOENT',
syscall: 'spawn cmd',
path: 'cmd',
spawnargs: [ '/s', '/c', 'start', '""', '/b', '"http://localhost:3000/"' ]
}
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.
If it's a new react project you are probably missing the node_modules folder, which means you didn't install the dependencies needed for the project. To do so, run 'npm install'. This should install all the dependencies you need. After this, you are going to be able to run npm start. If this does not help, please provide the package.json file at the root folder of your project so that we can see what is going on.
I added C:\Windows\System32 to PATH in environment variable. It worked