When I type npm start I get an error resolutions in package.json - reactjs

I was trying to start a project with 'npx create-react-app'.
However,
#types/eslint v8.4.4 missing from NPM registry same Error
so i tried 'npx create-react-app#5.0.1 test --template typescript --ignore-existing'
I solved the problem with that command, but another problem occurred
I typed the npm start command in vscode and an error as shown in the picture occurred.
error
So I put the following code in package.json.
{
"name": "test",
"version": "0.1.0",
"private": true,
"dependencies": {
"#testing-library/jest-dom": "^5.16.4",
"#testing-library/react": "^13.3.0",
"#testing-library/user-event": "^13.5.0",
"#types/jest": "^27.5.2",
"#types/node": "^16.11.42",
"#types/react": "^18.0.14",
"#types/react-dom": "^18.0.5",
"gh-pages": "^4.0.0",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-helmet": "^6.1.0",
"react-query": "^3.39.1",
"react-router-dom": "^5.3.0",
"react-scripts": "5.0.1",
"recoil": "^0.7.4",
"styled-components": "^5.3.5",
"typescript": "^4.7.4",
"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": {
"#types/eslint": "^8.4.3",
"#types/react-helmet": "^6.1.5",
"#types/react-router-dom": "^5.3.3",
"#types/styled-components": "^5.1.25"
},
"overrides": {
"#types/eslint": "8.4.3"
}
}
And Installed
npm i #types/eslint#8.4.3
npm i -D #types/eslint#8.4.3
But I keep getting an error like the picture...
npm v8.5.5
node v16.15.0

Related

cloned project installation errors

I got this project from repo and cloned it using git clone
then I go to the directory in which I cloned it.
next I went to install the project using NPM install command and these errors occur:-
here is the JSON file
{
"name": "grocery-storeowner-frontend",
"version": "0.1.0",
"private": true,
"dependencies": {
"#material-ui/core": "^4.12.4",
"#material-ui/icons": "^4.11.3",
"#material-ui/lab": "^4.0.0-alpha.61",
"#react-pdf/renderer": "^3.0.0",
"#splinetool/react-spline": "^2.2.1",
"#splinetool/runtime": "^0.9.104",
"#testing-library/jest-dom": "^5.16.5",
"#testing-library/react": "^13.3.0",
"#testing-library/user-event": "^13.5.0",
"axios": "^0.27.2",
"firebase": "^9.9.4",
"lodash": "^4.17.21",
"react": "^18.2.0",
"react-datepicker": "^4.8.0",
"react-dom": "^18.2.0",
"react-image-file-resizer": "^0.4.8",
"react-image-gallery": "^1.2.9",
"react-modal-image": "^2.5.0",
"react-query": "^3.39.2",
"react-responsive-carousel": "^3.2.23",
"react-router": "^6.3.0",
"react-router-dom": "^6.3.0",
"react-scripts": "5.0.1",
"react-toastify": "^9.0.8",
"styled-components": "^5.3.5",
"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"
]
}
}
Any help would be appreciated.
my versions are:-
node.js :- v16.16.0
please change your node version to latest and try once hop it works .it seems you are using outdated node version to your current project.

React: stuck at wait-on at localhost:3000

I have been trying to implement electron and react together ,with the below package.json
{
"name": "loader",
"version": "0.1.0",
"private": true,
"dependencies": {
"#testing-library/jest-dom": "^5.16.5",
"#testing-library/react": "^13.3.0",
"#testing-library/user-event": "^13.5.0",
"cross-env": "^7.0.3",
"electron-is-dev": "^2.0.0",
"react": "^18.2.0",
"react-countup": "^6.3.1",
"react-dom": "^18.2.0",
"react-icons": "^4.4.0",
"react-idle-timer": "^5.4.2",
"react-loader-spinner": "^5.3.3",
"react-rnd": "^10.3.7",
"react-router-dom": "^6.4.0",
"react-scripts": "5.0.1",
"react-spring": "^9.5.3",
"styled-components": "^5.3.5",
"web-vitals": "^2.1.4"
},
"main": "public/main.js",
"homepage": "./",
"scripts": {
"react-start": "react-scripts start",
"react-build": "react-scripts build",
"react-test": "react-scripts test --env=jsdom",
"react-eject": "react-scripts eject",
"electron-build": "electron-builder",
"release": "yarn react-build && electron-builder --publish=always",
"build": "yarn react-build && yarn electron-build",
"start": "concurrently \"cross-env BROWSER=none yarn react-start\" \"wait-on http://localhost:3000/ && electron .\""
},
"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": {
"concurrently": "^7.5.0",
"electron": "^21.2.3",
"electron-builder": "^23.6.0",
"wait-on": "^6.0.1"
}
}
It is clear that concurrently is being used to run all the commands together at same time. Now when I do yarn start, all commands are executed along with the react-start, but even after the react is available at http://localhost:3000 the wait-on never executes further and is stucked, eventually the electron never starts.
If tested without wait-on then all commands are executed well along with the electron.
Can someone guide on this?
I had the same issue.
All I needed to do was to change it from wait-on http://localhost:3000 to wait-on http://127.0.0.1:3000.
Hope that helps!

React project dependency issue

Have been struggling with dependency issues to no avail. I have built a React app (with typescript). I first added Auth0 authentication which requires React version 16.14.0. This works well despite being a more dated version of React.
Then, I wanted to install Material UI, however this requires React >17.0.0. How can I handle these dependency conflicts?
package.json
{
"name": "23xi-app",
"version": "0.1.0",
"private": true,
"dependencies": {
"#auth0/auth0-react": "^1.9.0",
"#testing-library/jest-dom": "^5.16.3",
"#testing-library/react": "^12.1.4",
"#testing-library/user-event": "^13.5.0",
"#types/jest": "^27.4.1",
"#types/node": "^16.11.26",
"#types/react": "^17.0.43",
"#types/react-dom": "^17.0.14",
"#types/styled-components": "^5.1.24",
"add": "^2.0.6",
"react": "^17.0.0",
"react-dom": "^16.14.0",
"react-icons": "^4.3.1",
"react-scripts": "5.0.0",
"styled-components": "^5.3.5",
"typescript": "^4.6.3",
"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"
]
}
}

npm run deploy occurs error 'includes' of undefined

I have been trying to deploy my changes to GitHub repository, but there is an error.
Failed to compile.
Cannot read property 'includes' of undefined
The commands I run:
git init
git add .
git commit -m 'upgrade'
npm run deploy
I always used to deploy that way.
I have installed some node and webpack devDependencies, after that this error occurred.
Here is my package.json
{
"name": "react-app",
"version": "0.1.0",
"private": true,
"dependencies": {
"#testing-library/jest-dom": "^5.14.1",
"#testing-library/react": "^12.1.2",
"#testing-library/user-event": "^13.4.2",
"emailjs-com": "^3.2.0",
"framer-motion": "^4.1.17",
"gsap": "^3.8.0",
"locomotive-scroll": "^4.1.3",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"react-gsap": "^3.2.1",
"react-icons": "^4.3.1",
"react-loading": "^2.0.3",
"react-locomotive-scroll": "^0.2.0",
"react-router-dom": "^5.3.0",
"react-scripts": "^4.0.3",
"react-scroll": "^1.8.4",
"sass-loader": "^12.2.0",
"styled-components": "^5.3.1",
"use-in-view": "^1.0.15",
"web-vitals": "^2.1.2",
"webpack": "^5.60.0"
},
"scripts": {
"predeploy": "npm run build",
"deploy": "gh-pages -d build",
"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": {
"gh-pages": "^3.2.3",
"html-webpack-plugin": "^5.5.0",
"node-sass": "^6.0.1",
"sass": "^1.43.3",
"webpack-dev-server": "^4.3.1"
}
}

How to fix-h -t ssh://git#github.com/ethereumjs/ethereumjs-abi.git

Up to 2 days ago I could install all dependencies of my project without any problem, but since today I am getting this ssh error:
-h -t ssh://git#github.com/ethereumjs/ethereumjs-abi.git
but the thing is that I do not have ethereumjs installed.
Here is my package.json
{
"name": "husky-farm",
"version": "0.1.0",
"private": true,
"dependencies": {
"#ethersproject/providers": "^5.4.1",
"#material-ui/core": "^4.11.4",
"#material-ui/icons": "^4.11.2",
"#material-ui/lab": "^4.0.0-alpha.60",
"#testing-library/jest-dom": "^5.12.0",
"#testing-library/react": "^11.2.7",
"#testing-library/user-event": "^12.8.3",
"#walletconnect/web3-provider": "^1.4.1",
"#web3-react/core": "^6.1.9",
"#web3-react/injected-connector": "^6.0.7",
"flag-icon-css": "^3.5.0",
"i18next": "^20.3.1",
"i18next-browser-languagedetector": "^6.1.1",
"i18next-http-backend": "^1.2.6",
"npm": "^7.19.1",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"react-i18next": "^11.10.0",
"react-router-dom": "^5.2.0",
"react-scripts": "4.0.3",
"react-stepper-horizontal": "^1.0.11",
"web-vitals": "^1.1.2",
"web3": "^1.3.6"
},
"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": {
"bignumber.js": "^9.0.1",
"dotenv-cli": "^4.0.0",
"eslint": "^7.30.0",
"eslint-plugin-react": "^7.24.0",
"ethers": "^5.4.1"
}
}
Any idea why all of sudden it asks me an ssh key?
Check first, as mentioned in the comments of this question, if updating node and npm to the latest version.
As seen in smartcontractkit/truffle-starter-kit issue 96, consider also using yarn, to test if this is more reliable than npm in your case.

Resources