how to fix npm install for react native - node.js

i am using react native to build a app every time I try to install a npm package i have to use --force, or --legacy-peer-deps to make it install else i get error so i thought it is because of version of react in my pakgage.json so i dissided to downgrade my react to 17.0.1 from 18.1.0 and i deleted my pakage.lock.json and node modules and i tried npm i then I am getting this error i want to get a clean installation for react native
npm i
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: sukprsavam#0.0.1
npm ERR! Found: react#17.0.1
npm ERR! node_modules/react
npm ERR! react#"17.0.1" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react-native#"^0.0.0-0 || 0.60 - 0.71 || 1000.0.0" from #react-native-async-storage/async-storage#1.17.11
npm ERR! node_modules/#react-native-async-storage/async-storage
npm ERR! #react-native-async-storage/async-storage#"^1.17.11" 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! peer react#"18.1.0" from react-native#0.70.6
npm ERR! node_modules/react-native
npm ERR! react-native#"0.70.6" from the root project
npm ERR! peer react-native#"^0.0.0-0 || 0.60 - 0.71 || 1000.0.0" from #react-native-async-storage/async-storage#1.17.11
npm ERR! node_modules/#react-native-async-storage/async-storage
npm ERR! #react-native-async-storage/async-storage#"^1.17.11" 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\vivek\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\vivek\AppData\Local\npm-cache\_logs\2023-01-04T06_02_30_598Z-debug-0.log
"name": "newapp",
"version": "1.0.0",
"main": "node_modules/expo/AppEntry.js",
"scripts": {
"start": "expo start",
"android": "expo start --android",
"ios": "expo start --ios",
"web": "expo start --web"
},
"dependencies": {
"#react-navigation/native": "^6.1.1",
"#react-navigation/native-stack": "^6.9.7",
"axios": "^1.2.2",
"expo": "~47.0.9",
"expo-status-bar": "~1.4.2",
"moment": "^2.29.4",
"react": "18.1.0",
"react-client-session": "^0.0.8",
"react-native": "0.70.5",
"react-native-network-logger": "^1.13.0",
"react-native-paper": "^5.1.2",
"react-native-safe-area-context": "4.4.1",
"react-native-screens": "~3.18.0",
"react-navigation": "^4.4.4"
},
"devDependencies": {
"#babel/core": "^7.12.9"
},
"private": true
}

Related

NPM Next / React package dependency conflict

I know this is related to React / React-DOM package dependency conflict, but the solutions which I can find there don't really help me.
When installing/updating a dependency or when deploying my Next.js app to Vercel, I get some of the following errors:
npm ERR! code ERESOLVE
npm ERR! ERESOLVE could not resolve
npm ERR!
npm ERR! While resolving: use-ackee#3.0.1
npm ERR! Found: react#18.2.0
npm ERR! node_modules/react
npm ERR! react#"^18.2.0" from the root project
npm ERR! peer react#"^18.0.0" from #testing-library/react#13.4.0
npm ERR! node_modules/#testing-library/react
npm ERR! #testing-library/react#"^13.4.0" from the root project
npm ERR! 5 more (next, react-dom, react-helmet, react-side-effect, styled-jsx)
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react#"^17.0.0" from use-ackee#3.0.1
npm ERR! node_modules/use-ackee
npm ERR! use-ackee#"^3.0.1" from the root project
npm ERR!
npm ERR! Conflicting peer dependency: react#17.0.2
npm ERR! node_modules/react
npm ERR! peer react#"^17.0.0" from use-ackee#3.0.1
npm ERR! node_modules/use-ackee
npm ERR! use-ackee#"^3.0.1" 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!
My package.json looks like this:
"dependencies": {
"#testing-library/jest-dom": "^5.16.5",
"#testing-library/react": "^13.4.0",
"#testing-library/user-event": "^13.5.0",
"next": "^13.1.6",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-helmet": "^6.1.0",
"sass": "^1.58.0",
"use-ackee": "^3.0.1",
"web-vitals": "^2.1.4"
},
I'm fully aware that I can just use --force or --legacy-peer-deps and everything works fine, but this seems like it is not really stable.
What is the exact problem I'm dealing with here? What can I do to resolve those conflicts?

How to solve upstream dependency conflict (react version 17 didn't work because dependency conflict)

I installed react version 18 but kakao-map-api was not install in 18 version, so I downgrade to react 17.2.0 but it did not work.
I read the error line but I can't understand at all. Do I have to fix all in script tag from package.json file?
For example, testing-library version, emotion/react version? How can I know the version which is fit in react 17? I forcely tried command 'npm install
react-kakao-maps-sdk' in cmd and of course it didn't work for same reason.
I tried downgrade 17 version on command line, and also in package.json but still not work.
Complying from command line, 'fix the upstream dependency conflict', how can I know which version and which library can solve dependency problem?
Here is the error line if I commanded 'npm install react-kakao-maps-sdk'.
npm install react-kakao-maps-sdk
npm WARN config global --global, --local are deprecated. Use --location=global instead.
npm ERR! code ERESOLVE
npm ERR! ERESOLVE could not resolve
npm ERR!
npm ERR! While resolving: #testing-library/react#13.3.0
npm ERR! Found: react#17.0.2
npm ERR! node_modules/react
npm ERR! peer react#">=16.8.0" from #emotion/react#11.9.3
npm ERR! node_modules/#emotion/react
npm ERR! peer #emotion/react#"^11.0.0-rc.0" from #emotion/styled#11.9.3
npm ERR! node_modules/#emotion/styled
npm ERR! peerOptional #emotion/styled#"^11.3.0" from #mui/material#5.9.0
npm ERR! node_modules/#mui/material
npm ERR! peer #mui/material#"^5.0.0" from #mui/icons-material#5.8.4
npm ERR! node_modules/#mui/icons-material
npm ERR! 1 more (the
root project)
npm ERR! 3 more (#mui/styled-engine, #mui/system, the root project)
npm ERR! peerOptional #emotion/react#"^11.5.0" from #mui/material#5.9.0
npm ERR! node_modules/#mui/material
npm ERR! peer #mui/material#"^5.0.0" from #mui/icons-material#5.8.4
npm ERR! node_modules/#mui/icons-material
npm ERR! #mui/icons-material#"^5.8.4" from the root project
npm ERR! 1 more (the root project)
npm ERR! 3 more (#mui/styled-engine, #mui/system, the
root project)
npm ERR! peer react#">=16.8.0" from #emotion/styled#11.9.3
npm ERR! node_modules/#emotion/styled
npm ERR! peerOptional #emotion/styled#"^11.3.0" from #mui/material#5.9.0
npm ERR! node_modules/#mui/material
npm ERR! peer #mui/material#"^5.0.0" from #mui/icons-material#5.8.4
npm ERR! node_modules/#mui/icons-material
npm ERR! #mui/icons-material#"^5.8.4" from the root project
npm ERR! 1 more (the root project)
npm ERR! peerOptional #emotion/styled#"^11.3.0" from #mui/styled-engine#5.8.7
npm ERR! node_modules/#mui/styled-engine
npm ERR! #mui/styled-engine#"^5.8.7" from #mui/system#5.9.0
npm ERR! node_modules/#mui/system
npm ERR! #mui/system#"^5.9.0" from #mui/material#5.9.0
npm ERR! node_modules/#mui/material
npm ERR! 2 more (#mui/system, the root project)
npm ERR! 12 more (#mui/base, #mui/icons-material, #mui/material, ...)
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react#"^18.0.0" from #testing-library/react#13.3.0
npm ERR! node_modules/#testing-library/react
npm ERR! #testing-library/react#"^13.3.0" from the root
project
npm ERR!
npm ERR! Conflicting peer dependency: 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! #testing-library/react#"^13.3.0" 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\USER\AppData\Local\npm-cache\eresolve-report.txt for a full report.
And here is my package.json file.
{
"name": "songpider-traveling-app",
"version": "0.1.0",
"private": true,
"dependencies": {
"#emotion/react": "^11.9.3",
"#emotion/styled": "^11.9.3",
"#mui/icons-material": "^5.8.4",
"#mui/material": "^5.9.0",
"#testing-library/jest-dom": "^5.16.4",
"#testing-library/react": "^13.3.0",
"#testing-library/user-event": "^13.5.0",
"npm": "^8.15.1",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"react-router": "^6.3.0",
"react-scripts": "^2.1.3",
"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"
]
}
}
enter code here
enter code here
npm install --legacy-peer-deps

React application from github not running on VS Code

sorry for newbie question. I have downloaded a react application from github. When I try to run locally on VS Code it gives me some dependencies errors.
Below is the dependencies on the json file:
"dependencies": {
"#chakra-ui/react": "^1.8.5",
"#emotion/react": "^11",
"#emotion/styled": "^11",
"#hookform/resolvers": "^2.8.8",
"algoliasearch": "^4.12.1",
"axios": "^0.26.0",
"framer-motion": "^6",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"react-hook-form": "^7.27.1",
"react-icons": "^4.3.1",
"react-images-uploading": "^3.1.3",
"react-instantsearch-dom": "^6.22.0",
"react-query": "^3.34.16",
"react-router-dom": "^6.2.1",
"react-table": "^7.7.0",
"recharts": "^2.1.9",
"sass": "^1.49.9",
"yup": "^0.32.11",
"zustand": "^3.7.0"
}
Error:
npm install
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: admin-family#0.0.0
npm ERR! Found: react#17.0.2
npm ERR! node_modules/react
npm ERR! react#"^17.0.2" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react#"^16.8.0" from react-images-uploading#3.1.3
npm ERR! node_modules/react-images-uploading
npm ERR! react-images-uploading#"^3.1.3" 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\12392\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\12392\AppData\Local\npm-cache\_logs\2022-03-09T00_59_26_007Z-debug-0.log
Running node v16.14.0
Any help on this appreciated.
run npm install --force or npm install --legacy-peer-deps
this will fix the error, because it ignores the peer dependencies and focuses on the main dependencies.
this has worked for me whenever i've gotten this error

Dependency Issue, React DnD Beautiful [duplicate]

This question already has answers here:
Unable to install react-beautiful-dnd package
(2 answers)
Closed 1 year ago.
I'm trying to install the following package, which is well known.
However, I'm a little confused as to how to diagnose this issue. I'd like to use this package as it's a core concept of my site, drag and drop.
Is this saying I need react #16.14.0? How would I go about bumping the entire project up correctly? Will this cause issues with other packages?
I am quite new to React and specifically this concept of tree dependencies? I also know my packages may be messed up, and if I need to, I'm happy to try resolve with tips.
npm i react-beautiful-dnd
However I get these errors:
npm ERR! code ERESOLVE
npm ERR! ERESOLVE could not resolve
npm ERR!
npm ERR! While resolving: new#0.1.0
npm ERR! Found: react#16.8.0
npm ERR! node_modules/react
npm ERR! peer react#">=16.8.0" from #emotion/react#11.7.0
npm ERR! node_modules/#emotion/react
npm ERR! peer #emotion/react#"^11.0.0-rc.0" from #emotion/styled#11.6.0
npm ERR! node_modules/#emotion/styled
npm ERR! peerOptional #emotion/styled#"^11.3.0" from #mui/material#5.2.3
npm ERR! node_modules/#mui/material
npm ERR! peer #mui/material#"^5.0.0" from #mui/icons-material#5.2.4
npm ERR! node_modules/#mui/icons-material
npm ERR! 1 more (the root project)
npm ERR! 3 more (#mui/styled-engine, #mui/system, the root project)
npm ERR! peerOptional #emotion/react#"^11.5.0" from #mui/material#5.2.3
npm ERR! node_modules/#mui/material
npm ERR! peer #mui/material#"^5.0.0" from #mui/icons-material#5.2.4
npm ERR! node_modules/#mui/icons-material
npm ERR! #mui/icons-material#"^5.2.4" from the root project
npm ERR! 1 more (the root project)
npm ERR! 3 more (#mui/styled-engine, #mui/system, the root project)
npm ERR! peer react#">=16.8.0" from #emotion/styled#11.6.0
npm ERR! node_modules/#emotion/styled
npm ERR! peerOptional #emotion/styled#"^11.3.0" from #mui/material#5.2.3
npm ERR! node_modules/#mui/material
npm ERR! peer #mui/material#"^5.0.0" from #mui/icons-material#5.2.4
npm ERR! node_modules/#mui/icons-material
npm ERR! #mui/icons-material#"^5.2.4" from the root project
npm ERR! 1 more (the root project)
npm ERR! peerOptional #emotion/styled#"^11.3.0" from #mui/styled-engine#5.2.0
npm ERR! node_modules/#mui/styled-engine
npm ERR! #mui/styled-engine#"^5.2.0" from #mui/system#5.2.3
npm ERR! node_modules/#mui/system
npm ERR! #mui/system#"^5.2.3" from #mui/material#5.2.3
npm ERR! node_modules/#mui/material
npm ERR! 2 more (#mui/system, the root project)
npm ERR! 22 more (#material-ui/core, #material-ui/icons, ...)
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! react-beautiful-dnd#"*" from the root project
npm ERR!
npm ERR! Conflicting peer dependency: react#16.14.0
npm ERR! node_modules/react
npm ERR! peer react#"^16.8.5 || ^17.0.0" from react-beautiful-dnd#13.1.0
npm ERR! node_modules/react-beautiful-dnd
npm ERR! react-beautiful-dnd#"*" 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.
It's worth noting my package.json looks:
{
"name": "new",
"version": "0.1.0",
"private": true,
"dependencies": {
"#emotion/react": "^11.7.0",
"#emotion/styled": "^11.6.0",
"#fontsource/roboto": "^4.5.1",
"#material-ui/icons": "^4.11.2",
"#mui/icons-material": "^5.2.4",
"#mui/material": "^5.2.3",
"#testing-library/jest-dom": "^5.11.4",
"#testing-library/react": "^11.1.0",
"#testing-library/user-event": "^12.1.10",
"framer-motion": "^4.1.17",
"gsap": "^3.9.1",
"material-ui-search-bar": "^1.0.0",
"react": "^16.8.0",
"react-dom": "^16.8.0",
"react-draggable": "^4.4.4",
"react-intersection-observer": "^8.33.1",
"react-scripts": "4.0.3",
"react-typewriter-effect": "^1.1.0",
"styled-components": "^5.3.3",
"typewriter-effect": "^2.18.2",
"web-vitals": "^1.0.1"
},
"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"
]
}
}
Is this saying I need react #16.14.0? How would I go about bumping the entire project up correctly? Will this cause issues with other packages?
Maybe your problem could be solved by removing the node_modules folder and running npm -g install npm, like this tutorial suggest: Unable to install react-beautiful-dnd package

NPM Install Errors

When running npm install I am getting an error that isn't reproducible on other computers. After installing everything and running webpack build it spews out an error. When looking at the directory webpack should have installed in it doesn't even exist. Is this a known npm install bug on mac?
Error when running
npm install:
> www# postinstall /Users/mackenzie/Desktop/omitted/www
> npm run webpack-build
> www# webpack-build /Users/mackenzie/Desktop/omitted/www
> NODE_ENV=production ./node_modules/.bin/webpack -p --no-color
sh: ./node_modules/.bin/webpack: No such file or directory
npm ERR! Darwin 15.6.0
npm ERR! argv "/usr/local/Cellar/node/7.4.0/bin/node" "/Users/mackenzie/Desktop/omitted/www/node_modules/.bin/npm" "run" "webpack-build"
npm ERR! node v7.4.0
npm ERR! npm v3.10.9
npm ERR! file sh
npm ERR! code ELIFECYCLE
npm ERR! errno ENOENT
npm ERR! syscall spawn
npm ERR! www# webpack-build: `NODE_ENV=production ./node_modules/.bin/webpack -p --no-color`
npm ERR! spawn ENOENT
npm ERR!
npm ERR! Failed at the www# webpack-build script 'NODE_ENV=production ./node_modules/.bin/webpack -p --no-color'.
npm ERR! Make sure you have the latest version of node.js and npm installed.
npm ERR! If you do, this is most likely a problem with the www package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR! NODE_ENV=production ./node_modules/.bin/webpack -p --no-color
npm ERR! You can get information on how to open an issue for this project with:
npm ERR! npm bugs www
npm ERR! Or if that isn't available, you can get their info via:
npm ERR! npm owner ls www
npm ERR! There is likely additional logging output above.
npm ERR! Please include the following file with any support request:
npm ERR! /Users/mackenzie/Desktop/omitted/www/npm-debug.log
npm WARN www# No license field.
npm ERR! Darwin 15.6.0
npm ERR! argv "/usr/local/Cellar/node/7.4.0/bin/node" "/usr/local/bin/npm" "install"
npm ERR! node v7.4.0
npm ERR! npm v4.0.5
npm ERR! code ELIFECYCLE
npm ERR! www# postinstall: `npm run webpack-build`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the www# postinstall script 'npm run webpack-build'.
npm ERR! Make sure you have the latest version of node.js and npm installed.
npm ERR! If you do, this is most likely a problem with the www package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR! npm run webpack-build
npm ERR! You can get information on how to open an issue for this project with:
npm ERR! npm bugs www
npm ERR! Or if that isn't available, you can get their info via:
npm ERR! npm owner ls www
package.json
"scripts": {
"lint": "semistandard web/js/orders/* web/js/categories/* web/js/orders/* web/js/site/* web/js/user/*",
"webpack-dev": "NODE_ENV=development ./node_modules/.bin/webpack --watch --progress",
"webpack-build": "NODE_ENV=production ./node_modules/.bin/webpack -p --no-color",
"postinstall": "npm run webpack-build"
},
"devDependencies": {
"autoprefixer": "^6.5.2",
"babel-core": "^6.18.2",
"babel-loader": "^6.2.7",
"babel-polyfill": "^6.16.0",
"babel-preset-es2015": "^6.18.0",
"babel-preset-react": "^6.16.0",
"browser-sync": "^2.17.5",
"browser-sync-webpack-plugin": "^1.1.3",
"css-loader": "^0.25.0",
"eslint": "^3.10.1",
"eslint-config-semistandard": "^7.0.0",
"eslint-config-standard": "^6.2.1",
"eslint-config-standard-react": "^4.2.0",
"eslint-loader": "^1.6.1",
"eslint-plugin-promise": "^3.3.2",
"eslint-plugin-standard": "^2.0.1",
"extract-text-webpack-plugin": "^1.0.1",
"file-loader": "^0.9.0",
"less": "^2.7.1",
"less-loader": "^2.2.3",
"path": "^0.12.7",
"postcss-loader": "^1.1.0",
"semistandard": "^9.0.0",
"style-loader": "^0.13.1",
"url-loader": "^0.5.7",
"webpack": "^1.13.3",
"webpack-dev-middleware": "^1.8.4",
"webpack-hot-middleware": "^2.13.1"
},
"dependencies": {
"i": "^0.3.5",
"lodash": "^4.16.6",
"npm": "^3.10.9",
"react": "^15.3.2",
"react-addons-css-transition-group": "^15.3.2",
"react-dom": "^15.3.2"
}
NPM picked is different
npm ERR! npm v3.10.9
npm ERR! npm v4.0.5
Try:
sudo npm install --unsafe-perm=true --allow-root
suggested by external link to solution

Resources