React Dependency Tree Issue - javascript

Can anyone tell me what's incorrect here? I am trying to install the mui search bar component.
npm i --save material-ui-search-bar
However I do receive the following:
PS Z:\WebDev\ApplyWithin\frontend> npm i --save material-ui-search-bar
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: new#0.1.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! peer react#"^16.8.0 || ^17.0.0" from #material-ui/core#4.12.3
npm ERR! node_modules/#material-ui/core
npm ERR! peer #material-ui/core#"^4.0.0" from material-ui-search-bar#1.0.0
npm ERR! node_modules/material-ui-search-bar
npm ERR! material-ui-search-bar#"*" from the root project
npm ERR! peer #material-ui/core#"^4.0.0" from #material-ui/icons#4.11.2
npm ERR! node_modules/#material-ui/icons
npm ERR! #material-ui/icons#"^4.11.2" from the root project
npm ERR! 1 more (material-ui-search-bar)
npm ERR! 2 more (react-dom, #material-ui/icons)
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react#"^16.8.0" from material-ui-search-bar#1.0.0
npm ERR! node_modules/material-ui-search-bar
npm ERR! material-ui-search-bar#"*" 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.
My package.json is:
{
"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",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"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"
]
}
}
Does anyone have a clue here?

Issue seems to be related to peer dependency of material-ui-search-bar. Having a peer dependency means that your package needs a dependency that is the same exact dependency as the person installing your package.
As stated in the error posted by you. It needs react version ^16.8.0 or lower to run.
But in your project you have specified an bigger version of react - ^17.0.2.
What you can do is lower your react version. Then you should be able to install the said package without any issues.

Related

npm ERR! code ERESOLVE npm ERR! ERESOLVE could not resolve. When I ran npm install

When I run 'npm install' to install the dependencies from a cloned repository I get the error below from the terminal. I use windows 10
npm ERR! ERESOLVE could not resolve
npm ERR!
npm ERR! While resolving: react-scripts#4.0.0
npm ERR! Found: typescript#4.1.3
npm ERR! node_modules/typescript
npm ERR! dev typescript#"4.1.3" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peerOptional typescript#"^3.2.1" from react-scripts#4.0.0
npm ERR! node_modules/react-scripts
npm ERR! react-scripts#"4.0.0" from the root project
npm ERR!
npm ERR! Conflicting peer dependency: typescript#3.9.10
npm ERR! node_modules/typescript
npm ERR! peerOptional typescript#"^3.2.1" from react-scripts#4.0.0
npm ERR! node_modules/react-scripts
npm ERR! react-scripts#"4.0.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-PC\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\USER-PC\AppData\Local\npm-cache\_logs\2022-10-04T10_18_32_
Even when I ran npm install --legacy-peer-deps I still get same error. Please what could possibly be wrong?
And here's the content in my package.json file:
}
]
"name": "info-site",
"version": "1.0.0",
"description": "",
"keywords": [],
"main": "src/index.js",
"dependencies": {
"react": "18.2.0",
"react-dom": "18.2.0",
"react-scripts": "4.0.0"
},
"devDependencies": {
"#babel/runtime": "7.13.8",
"typescript": "4.1.3"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject"
},
"browserslist": [
">0.2%",
"not dead",
"not ie <= 11",
"not op_mini all"
]
}
The error is telling you that react-scripts#4.0.0 supports typescript#^3.2.1 (i.e. TypeScript >=3.2.1, <4) as a peer dependency.
Your dev dependencies have TypeScript 4 (not 3.2.x) in them, which is not supported by that version of react-scripts, hence the resolution error.
The current version of react-scripts is 5.0.1, so I'd recommend upgrading react-scripts to that version (simply by changing that "4.0.0" in your package.json to "5.0.1") and trying again, since that version declares support for TypeScript 4.

i am just trying to install the package of react js but i am getting errors

I am just trying to install react but I am getting errors.
I have installed npm -v 8.12.1 version in my system. I have tried to downgrade react but it doesn't help
I have tried these type:
update npm npm install npm -g
downgraded react to "react": "15.3.0"
cleared cache: npm cache clear
removed node_modules, rm -rf node_modules,
reinstalled node_modules, npm install
{
"name": "ant-design-pro",
"version": "2.0.0",
"description": "An out-of-box UI solution for enterprise applications",
"private": true,
"scripts": {
"precommit": "npm run lint-staged",
"presite": "node ./scripts/generateMock.js && cd functions && npm install",
"start": "cross-env APP_TYPE=site umi dev",
"start:no-mock": "cross-env MOCK=none umi dev",
"build": "umi build",
"site": "npm run presite && cross-env APP_TYPE=site npm run build && firebase deploy",
"analyze": "cross-env ANALYZE=1 umi build",
"lint:style": "stylelint \"src/**/*.less\" --syntax less",
"lint": "eslint --ext .js src mock tests && npm run lint:style",
"lint:fix": "eslint --fix --ext .js src mock tests && npm run lint:style",
"lint-staged": "lint-staged",
"lint-staged:js": "eslint --ext .js",
"test": "umi test",
"test:component": "umi test ./src/components",
"test:all": "node ./tests/run-tests.js",
"prettier": "prettier --write ./src/**/**/**/*",
"docker:dev": "docker-compose -f ./docker/docker-compose.dev.yml up",
"docker:build": "docker-compose -f ./docker/docker-compose.dev.yml build",
"docker-prod:dev": "docker-compose -f ./docker/docker-compose.yml up",
"docker-prod:build": "docker-compose -f ./docker/docker-compose.yml build"
},
"dependencies": {
"#antv/data-set": "^0.9.6",
"#babel/runtime": "^7.0.0",
"antd": "^3.11.6",
"bizcharts": "^3.2.2",
"bizcharts-plugin-slider": "^2.0.3",
"classnames": "^2.2.6",
"dva": "^2.4.0",
"enquire-js": "^0.2.1",
"hash.js": "^1.1.5",
"highlight.js": "^9.13.1",
"lodash": "^4.17.10",
"lodash-decorators": "^6.0.0",
"marked": "^0.5.2",
"memoize-one": "^4.0.0",
"moment": "^2.22.2",
"numeral": "^2.0.6",
"nzh": "^1.0.3",
"omit.js": "^1.0.0",
"path-to-regexp": "^2.4.0",
"prop-types": "^15.5.10",
"qs": "^6.5.2",
"rc-animate": "^2.4.4",
"react": "^16.8.6",
"react-container-query": "^0.11.0",
"react-copy-to-clipboard": "^5.0.1",
"react-document-title": "^2.0.3",
"react-dom": "^16.8.6",
"react-fittext": "^1.0.0",
"react-router-dom": "^4.3.1",
"save": "^2.3.2",
"simplemde": "^1.11.2"
},
"devDependencies": {
"#types/react": "^16.4.11",
"#types/react-dom": "^16.0.6",
"antd-pro-merge-less": "^0.0.9",
"antd-pro-theme-webpack-plugin": "^1.1.8",
"babel-eslint": "^9.0.0",
"babel-plugin-transform-decorators-legacy": "^1.3.5",
"cross-env": "^5.1.1",
"cross-port-killer": "^1.0.1",
"enzyme": "^3.4.4",
"eslint": "^5.4.0",
"eslint-config-airbnb": "^17.0.0",
"eslint-config-prettier": "^3.0.1",
"eslint-plugin-babel": "^5.1.0",
"eslint-plugin-compat": "^2.5.1",
"eslint-plugin-import": "^2.8.0",
"eslint-plugin-jsx-a11y": "^6.0.3",
"eslint-plugin-markdown": "^1.0.0-beta.6",
"eslint-plugin-react": "^7.11.1",
"gh-pages": "^2.0.0",
"husky": "^0.14.3",
"lint-staged": "^7.2.0",
"merge-umi-mock-data": "^0.0.3",
"mockjs": "^1.0.1-beta3",
"prettier": "1.14.2",
"pro-download": "^1.0.1",
"stylelint": "^9.4.0",
"stylelint-config-prettier": "^4.0.0",
"stylelint-config-standard": "^18.0.0",
"umi": "^2.1.1",
"umi-plugin-ga": "^1.0.3",
"umi-plugin-react": "^1.1.1"
},
"optionalDependencies": {
"puppeteer": "^1.6.0"
},
"lint-staged": {
"**/*.{js,jsx,less}": [
"prettier --write",
"git add"
],
"**/*.{js,jsx}": "npm run lint-staged:js",
"**/*.less": "stylelint --syntax less"
},
"engines": {
"node": ">=8.0.0"
},
"browserslist": [
"> 1%",
"last 2 versions",
"not ie <= 10"
]
}
npm ERR! code ERESOLVE
npm ERR! ERESOLVE could not resolve
npm ERR!
npm ERR! While resolving: react-fittext#1.0.0
npm ERR! Found: react#16.14.0
npm ERR! node_modules/react
npm ERR! react#"^16.8.6" from the root project
npm ERR! peer react#"^0.14.0 || ^15.0.0 || ^16.0.0" from #ant-design/create-react-context#0.2.5
npm ERR! node_modules/#ant-design/create-react-context
npm ERR! #ant-design/create-react-context#"^0.2.4" from antd#3.26.20
npm ERR! node_modules/antd
npm ERR! antd#"^3.11.6" from the root project
npm ERR! 1 more (umi-plugin-react)
npm ERR! #ant-design/create-react-context#"^0.2.4" from rc-mentions#0.4.2
npm ERR! node_modules/rc-mentions
npm ERR! rc-mentions#"~0.4.0" from antd#3.26.20
npm ERR! node_modules/antd
npm ERR! antd#"^3.11.6" from the root project
npm ERR! 1 more (umi-plugin-react)
npm ERR! 2 more (rc-tabs, rc-tree)
npm ERR! 47 more (#ant-design/icons-react, airbnb-prop-types, antd, ...)
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react#"^15.0.0" from react-fittext#1.0.0
npm ERR! node_modules/react-fittext
npm ERR! react-fittext#"^1.0.0" from the root project
npm ERR!
npm ERR! Conflicting peer dependency: react#15.7.0
npm ERR! node_modules/react
npm ERR! peer react#"^15.0.0" from react-fittext#1.0.0
npm ERR! node_modules/react-fittext
npm ERR! react-fittext#"^1.0.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\91639\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\91639\AppData\Local\npm-cache\_logs\2022-06-03T09_27_25_556Z-debug-0.log
As the error reads, you have dependency conflict.
Run the command with --legacy-peer-deps.
npm install --legacy-peer-deps

How to install react navigation?

I'm a beginner in coding which means i follow tutorials from youtube. The project that i'm making uses react-navigation/native, but when i tried to install it, it gives me this error:
npm ERR! code ERESOLVE
npm ERR! ERESOLVE could not resolve
npm ERR!
npm ERR! While resolving: react-native-elements#3.4.2
npm ERR! Found: react-native-safe-area-context#4.2.5
npm ERR! node_modules/react-native-safe-area-context
npm ERR! react-native-safe-area-context#"^4.2.5" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react-native-safe-area-context#"^3.1.9" from react-native-elements#3.4.2
npm ERR! node_modules/react-native-elements
npm ERR! react-native-elements#"^3.4.2" from the root project
npm ERR!
npm ERR! Conflicting peer dependency: react-native-safe-area-context#3.4.1
npm ERR! node_modules/react-native-safe-area-context
npm ERR! peer react-native-safe-area-context#"^3.1.9" from react-native-elements#3.4.2
npm ERR! node_modules/react-native-elements
npm ERR! react-native-elements#"^3.4.2" 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\ps3pl\AppData\Local\npm-cache\eresolve-report.txt for a full r
eport.
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\ps3pl\AppData\Local\npm-cache\_logs\2022-05-29T06_56_49_981Z-d
ebug-0.log
I am building using EXPO
This is my package.json file:
{
"name": "uber-clone",
"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",
"eject": "expo eject"
},
"dependencies": {
"#reduxjs/toolkit": "^1.8.2",
"expo": "~45.0.0",
"expo-status-bar": "~1.3.0",
"react": "17.0.2",
"react-dom": "17.0.2",
"react-native": "0.68.2",
"react-native-elements": "^3.4.2",
"react-native-safe-area-context": "^4.2.5",
"react-native-vector-icons": "^9.1.0",
"react-native-web": "0.17.7",
"react-redux": "^8.0.2",
"tailwind-react-native-classnames": "^1.5.1"
},
"devDependencies": {
"#babel/core": "^7.12.9"
},
"private": true
}
Try using the flag --legacy-peer-deps.
npm install #react-navigation/native --legacy-peer-deps
your problem is almost similar to How to get npm to install a single package?
read the answer carefully.
solution:
try to resolve the issue with correct package version as the error message suggested.
if you couldn't do it use
npm install #react-navigation/native --legacy-peer-deps
or
npm install #react-navigation/native --force
Be sure you may get conflict issues while developing.

Project missing node_modules dir but npm intall fails

My project is missing it's node_modules dir. I've tried running npm install, but it fails like this:
...
npm WARN deprecated core-js#2.6.11: core-js#<3.3 is no longer maintained and not recommended for usage due to the number of issues. Because of the V8 engine whims, feature detection in old core-js versions could cause a slowdown up to 100x even if nothing is polyfilled. Please, upgrade your dependencies to the actual version of core-js.
npm ERR! code 1
npm ERR! path C:\users\me\IdeaProjects\portal\cp-frontend\node_modules\node-sass
npm ERR! command failed
npm ERR! command C:\WINDOWS\system32\cmd.exe /d /s /c node scripts/build.js
npm ERR! Building: C:\Program Files\nodejs\node.exe C:\users\me\IdeaProjects\portal\cp-frontend\node_modules\node-gyp\bin\node-gyp.js rebuild --verbose --libsass_ext= --libsass_cflags= --libsass_ldflags= --libsass_library=
npm ERR! Building the projects in this solution one at a time. To enable parallel build, please add the "/m" switch.
npm ERR! Build started 10/1/2021 3:15:35 PM.
npm ERR! Project "C:\users\me\IdeaProjects\portal\cp-frontend\node_modules\node-sass\build\binding.sln" on node 1 (default targets).
npm ERR! ValidateSolutionConfiguration:
npm ERR! Building solution configuration "Release|x64".
npm ERR! Project "C:\users\me\IdeaProjects\portal\cp-frontend\node_modules\node-sass\build\binding.sln" (1) is building "C:\users\me\IdeaProjects\portal\cp-frontend\node_modules\node-sass\build\binding.vcxproj.metaproj" (2) on node 1 (default targets).
...
I've tried
npm install --global --production windows-build-tools#4.0.0
in powershell as administrator, then exit and re-enter powershell as administrator, then trying npm install but still get this error.
Any ideas? I've tried googling it, and the suggestion was npm install --global --production windows-build-tools#4.0.0 (without #4.0.0 that fails too).
Looking at the packages.json file, it lists these dependencies. I'm not sure if that is helpful or not.
{
"name": "customer-portal-frontend",
"version": "0.1.0",
"private": true,
"dependencies": {
"#testing-library/jest-dom": "^4.2.4",
"#testing-library/react": "^9.3.2",
"#testing-library/user-event": "^7.1.2",
"antd": "^4.1.0",
"autoprefixer": "^9.7.6",
"axios": "^0.19.2",
"classnames": "^2.2.6",
"crypto-js": "^4.0.0",
"dayjs": "^1.8.23",
"node-sass": "^4.13.1",
"normalize.css": "^8.0.1",
"numeral": "^2.0.6",
"query-string": "^6.12.1",
"react": "^16.12.0",
"react-app-polyfill": "^1.0.6",
"react-dom": "^16.12.0",
"react-ga": "^2.7.0",
"react-helmet": "^6.1.0",
"react-hook-form": "^5.3.1",
"react-intercom": "^1.0.15",
"react-responsive-tabs": "^3.3.0",
"react-router-dom": "^5.1.2",
"react-scripts": "^3.4.1",
"reactn": "^2.2.6",
"tailwindcss": "^1.2.0",
"victory": "^34.1.3"
},
"scripts": {
"start": "npm run tailwind:css && react-scripts start",
"build": "npm run tailwind:css && react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject",
"tailwind:css": "tailwind build src/tailwind.src.css -c tailwind.js -o src/tailwind.css"
},
"eslintConfig": {
"extends": "react-app"
},
"browserslist": {
"production": [
"ie 11",
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
],
"development": [
"ie 11",
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
}
}
If I use npm start in the next level up dir, I get a popup regarding (but it's probably too early to do npm start since there's no node_modules dir and npm install fails)
Script: c:\Users\me\IdeaProjects\portal\cp-frontend\tailwind.js
Line: 32
Char: 7
Error: expected identifier, string or number
Code: 800A0404
Source: Microsoft JScript compilation error
Update 1:
Ran npm install node-gyp in the frontend dir and see similar errors as npm install. I can run that fine in the backend dir. I don't know why this dir fails. I have windows command prompt open as administrator in both cases..not sure if that would matter.
npm ERR! code 1
npm ERR! path C:\Users\me\IdeaProjects\portal\cp-frontend\node_modules\node-sass
npm ERR! command failed
npm ERR! command C:\WINDOWS\system32\cmd.exe /d /s /c node scripts/build.js
npm ERR! Building: C:\Program Files\nodejs\node.exe C:\Users\me\IdeaProjects\portal\cp-frontend\node_modules\node-sass\node_modules\node-gyp\bin\node-gyp.js rebuild --verbose --libsass_ext= --libsass_cflags= --libsass_ldflags= --libsass_library=
npm ERR! Building the projects in this solution one at a time. To enable parallel build, please add the "/m" switch.
npm ERR! Build started 10/4/2021 8:35:00 AM.
npm ERR! Project "C:\Users\me\IdeaProjects\portal\cp-frontend\node_modules\node-sass\build\binding.sln" on node 1 (default targets).
npm ERR! ValidateSolutionConfiguration:
npm ERR! Building solution configuration "Release|x64".
npm ERR! Project "C:\Users\me\IdeaProjects\portal\cp-frontend\node_modules\node-sass\build\binding.sln" (1) is building "C:\Users\me\IdeaProjects\portal\cp-frontend\node_modules\node-sass\build\binding.vcxproj.metaproj" (2) on node 1 (default targets).
npm ERR! Project "C:\Users\me\IdeaProjects\portal\cp-frontend\node_modules\node-sass\build\binding.vcxproj.metaproj" (2) is building "C:\Users\me\IdeaProjects\portal\cp-frontend\node_modules\node-sass\build\src\libsass.vcxproj" (3) on node 1 (default targets).
npm ERR! C:\Users\me\IdeaProjects\portal\cp-frontend\node_modules\node-sass\build\src\libsass.vcxproj(20,3): error MSB4019: The imported project "C:\Microsoft.Cpp.Default.props" was not found. Confirm that the path in the <Import> declaration is correct, and that the file exists on disk.
...
Update2:
Tried npm cache clean --force. Then npm install sass, but it's still trying to do npm install node-sass.
npm ERR! code 1
npm ERR! path C:\Users\me\IdeaProjects\portal\cp-frontend\node_modules\node-sass
npm ERR! command failed
npm ERR! command C:\WINDOWS\system32\cmd.exe /d /s /c node scripts/build.js
npm ERR! Building: C:\Program Files\nodejs\node.exe C:\Users\me\IdeaProjects\portal\cp-frontend\node_modules\node-gyp\bin\node-gyp.js rebuild --verbose --libsass_ext= --libsass_cflags= --libsass_ldflags= --libsass_library=
npm ERR! Building the projects in this solution one at a time. To enable parallel build, please add the "/m" switch.
Delete current folder node_modules and run npm as a regular user, non administrator/root.
Try ever possible avoid run npm commands as Administrator/Root, this is a pratice discouraged, because third's commands may be executed.

How can resolve this situation Error ERESOLVE could not resolve [duplicate]

This question already has answers here:
Fix the upstream dependency conflict installing NPM packages
(15 answers)
Closed 1 year ago.
After running npm install, first I got an error with jasmine-core.
After solving that, I'm getting this error:
npm ERR! code ERESOLVE
npm ERR! ERESOLVE could not resolve
npm ERR!
npm ERR! While resolving: client#0.0.0
npm ERR! Found: #angular/compiler#11.0.9
npm ERR! node_modules/#angular/compiler
npm ERR! #angular/compiler#"^11.0.7" from the root project
npm ERR! peer #angular/compiler#"11.0.9" from #angular/compiler-cli#11.0.9
npm ERR! node_modules/#angular/compiler-cli
npm ERR! dev #angular/compiler-cli#"~11.0.7" from the root project
npm ERR! peer #angular/compiler-cli#"^11.0.0" from #angular-devkit/build-angular#0.1100.7
npm ERR! node_modules/#angular-devkit/build-angular
npm ERR! dev #angular-devkit/build-angular#"^0.1100.6" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! #angular/platform-browser-dynamic#"^11.0.7" from the root project
npm ERR!
npm ERR! Conflicting peer dependency: #angular/compiler#11.2.14
npm ERR! node_modules/#angular/compiler
npm ERR! peer #angular/compiler#"11.2.14" from #angular/platform-browser-dynamic#11.2.14
npm ERR! node_modules/#angular/platform-browser-dynamic
npm ERR! #angular/platform-browser-dynamic#"^11.0.7" 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 /home/salami/.npm/eresolve-report.txt for a full report.
npm ERR! A complete log of this run can be found in:
npm ERR! /home/salami/.npm/_logs/2021-09-25T09_49_52_657Z-debug.log
What is that I'm doing wrong or should fix?
I will add my package.json file if it's needed.
Updated:
after running with --force I'm getting this error now :
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: client#0.0.0
npm ERR! Found: #angular/common#11.2.14
npm ERR! node_modules/#angular/common
npm ERR! #angular/common#"^11.0.7" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer #angular/common#"^12.0.0 || ^13.0.0-0" from #angular/cdk#12.2.7
npm ERR! node_modules/#angular/cdk
npm ERR! peer #angular/cdk#"^12.0.0" from #angular/flex-layout#12.0.0-beta.35
npm ERR! node_modules/#angular/flex-layout
npm ERR! #angular/flex-layout#"*" 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 /home/salami/.npm/eresolve-report.txt for a full report.
npm ERR! A complete log of this run can be found in:
npm ERR! /home/salami/.npm/_logs/2021-09-25T12_07_03_361Z-debug.log
THis is my package.json
{
"name": "client",
"version": "0.0.0",
"license": "MIT",
"scripts": {
"ng": "ng",
"start": "ng serve --proxy-config proxy.conf.json",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e"
},
"private": true,
"dependencies": {
"#angular/animations": "^11.0.7",
"#angular/common": "^11.0.7",
"#angular/compiler": "^11.0.7",
"#angular/core": "^11.0.7",
"#angular/forms": "^11.0.7",
"#angular/platform-browser": "^11.0.7",
"#angular/platform-browser-dynamic": "^11.0.7",
"#angular/router": "^11.0.7",
"core-js": "^3.6.5",
"rxjs": "^6.6.0",
"tslib": "^2.3.1",
"zone.js": "~0.10.3"
},
"devDependencies": {
"#angular-devkit/build-angular": "^0.1100.6",
"#angular/cli": "^11.0.6",
"#angular/compiler-cli": "~11.0.7",
"#angular/language-service": "~11.0.7",
"#types/jasmine": "~3.6.0",
"#types/jasminewd2": "~2.0.8",
"#types/node": "^14.0.14",
"codelyzer": "^6.0.0",
"jasmine-core": "~3.6.0",
"jasmine-spec-reporter": "~5.0.0",
"karma": "~5.1.0",
"karma-chrome-launcher": "~3.1.0",
"karma-coverage-istanbul-reporter": "~3.0.3",
"karma-jasmine": "~4.0.0",
"karma-jasmine-html-reporter": "^1.5.0",
"protractor": "~7.0.0",
"ts-node": "~8.10.2",
"tslint": "~6.1.2",
"typescript": "~4.0.5"
}
}
If dependency conflict occurred, try running with --force argument as below:
npm install --legacy-peer-deps --force

Categories