Version Conflicts in the Package.json file

I am using a no. of things like ck-editor, django, react, webpack etc. in my project.
Currently, i want to install new dependencies and libraries, but there are some version conflicts that i am facing ,
to be precise the problem is ,somehow the curren…


This content originally appeared on DEV Community and was authored by Himanshu Jangid

I am using a no. of things like ck-editor, django, react, webpack etc. in my project.
Currently, i want to install new dependencies and libraries, but there are some version conflicts that i am facing ,
to be precise the problem is ,somehow the current structure is working fine, but when i want to add any new dependency using "npm install" using the package.json file but it is facing a version conflict error everytime.
Here is the package.json file :
{
"name": "u4rad-report",
"version": "1.0.0",
"private": true,
"homepage": "http://34.93.156.210/report",
"main": "index.js",
"dependencies": {
"@babel/core": "^7.16.0",
"@ckeditor/ckeditor5-build-decoupled-document": "^27.1.0",
"@ckeditor/ckeditor5-react": "^1.1.0",
"@jsonforms/core": "^3.2.1",
"@jsonforms/material-renderers": "^3.2.1",
"@jsonforms/react": "^3.2.1",
"@jsonforms/vanilla-renderers": "^3.2.1",
"@material-ui/core": "^4.11.4",
"@material-ui/icons": "^4.11.2",
"@pmmmwh/react-refresh-webpack-plugin": "^0.5.3",
"@svgr/webpack": "^5.5.0",
"axios": "^1.6.7",
"babel-jest": "^27.4.2",
"babel-loader": "^8.2.3",
"babel-plugin-named-asset-import": "^0.3.8",
"babel-preset-react-app": "^10.0.1",
"bfj": "^7.0.2",
"bootstrap": "^4.6.0",
"browserslist": "^4.18.1",
"camelcase": "^6.2.1",
"case-sensitive-paths-webpack-plugin": "^2.4.0",
"cors": "^2.8.5",
"css-loader": "^6.5.1",
"css-minimizer-webpack-plugin": "^3.2.0",
"dotenv": "^10.0.0",
"dotenv-expand": "^5.1.0",
"eslint": "^8.3.0",
"eslint-config-react-app": "^7.0.1",
"eslint-webpack-plugin": "^3.1.1",
"express": "^4.17.1",
"file-loader": "^6.2.0",
"fs-extra": "^10.0.0",
"googleapis": "^122.0.0",
"html-webpack-plugin": "^5.5.0",
"html2pdf.js": "^0.10.1",
"identity-obj-proxy": "^3.0.0",
"jest": "^27.4.3",
"jest-resolve": "^27.4.2",
"jest-watch-typeahead": "^1.0.0",
"jquery": "^3.6.0",
"mini-css-extract-plugin": "^2.4.5",
"popper": "^1.0.1",
"postcss": "^8.4.4",
"postcss-flexbugs-fixes": "^5.0.2",
"postcss-loader": "^6.2.1",
"postcss-normalize": "^10.0.1",
"postcss-preset-env": "^7.0.1",
"prompts": "^2.4.2",
"query-string": "^4.3.4",
"react": "16.8.0",
"react-app-polyfill": "^3.0.0",
"react-bootstrap4-modal": "^1.7.5",
"react-dev-utils": "^12.0.1",
"react-dom": "16.8.0",
"react-refresh": "^0.11.0",
"react-share": "^4.4.1",
"resolve": "^1.20.0",
"resolve-url-loader": "^4.0.0",
"sass-loader": "^12.3.0",
"semver": "^7.3.5",
"sequelize": "^6.6.2",
"source-map-loader": "^3.0.0",
"sqlite3": "^5.0.2",
"style-loader": "^3.3.1",
"tailwindcss": "^3.0.2",
"terser-webpack-plugin": "^5.2.5",
"webpack-dev-server": "^4.6.0",
"webpack-manifest-plugin": "^4.0.2",
"workbox-webpack-plugin": "^6.4.1"
},
"scripts": {
"start": "node scripts/start.js",
"build": "node scripts/build.js",
"test": "node scripts/test.js --env=jsdom",
"build:webpack": "webpack --mode=production",
"start:webpack": "webpack --watch",
"dev:webpack": "webpack --mode=development"
},
"devDependencies": {
"@babel/core": "^7.18.6",
"@babel/plugin-proposal-class-properties": "^7.18.6",
"@babel/plugin-transform-runtime": "^7.15.0",
"@babel/preset-env": "^7.18.6",
"@babel/preset-react": "^7.18.6",
"@babel/runtime": "^7.15.3",
"@emotion/babel-plugin": "^11.3.0",
"assert": "^2.0.0",
"autoprefixer": "^10.3.4",
"babel-loader": "^8.2.5",
"buffer": "^6.0.3",
"crypto": "npm:crypto-browserify",
"crypto-browserify": "^3.12.0",
"css-loader": "^6.2.0",
"https-browserify": "^1.0.0",
"json-loader": "^0.5.7",
"node-sass": "^6.0.1",
"os-browserify": "^0.3.0",
"postcss": "^8.3.6",
"postcss-loader": "^6.1.1",
"resolve-cwd": "^3.0.0",
"sass-loader": "^12.1.0",
"stream": "npm:stream-browserify",
"stream-browserify": "^3.0.0",
"stream-http": "^3.2.0",
"style-loader": "^3.2.1",
"webpack": "^5.91.0",
"webpack-cli": "^4.8.0"
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
},
"jest": {
"roots": [
"/src"
],
"collectCoverageFrom": [
"src//*.{js,jsx,ts,tsx}",
"!src/
/.d.ts"
],
"setupFiles": [
"react-app-polyfill/jsdom"
],
"setupFilesAfterEnv": [],
"testMatch": [
"/src/
/tests//.{js,jsx,ts,tsx}",
"/src/*/.{spec,test}.{js,jsx,ts,tsx}"
],
"testEnvironment": "jsdom",
"transform": {
"^.+\.(js|jsx|mjs|cjs|ts|tsx)$": "/config/jest/babelTransform.js",
"^.+\.css$": "/config/jest/cssTransform.js",
"^(?!.*\.(js|jsx|mjs|cjs|ts|tsx|css|json)$)": "/config/jest/fileTransform.js"
},
"transformIgnorePatterns": [
"[/\\]node_modules[/\\].+\.(js|jsx|mjs|cjs|ts|tsx)$",
"^.+\.module\.(css|sass|scss)$"
],
"modulePaths": [],
"moduleNameMapper": {
"^react-native$": "react-native-web",
"^.+\.module\.(css|sass|scss)$": "identity-obj-proxy"
},
"moduleFileExtensions": [
"web.js",
"js",
"web.ts",
"ts",
"web.tsx",
"tsx",
"json",
"web.jsx",
"jsx",
"node"
],
"watchPlugins": [
"jest-watch-typeahead/filename",
"jest-watch-typeahead/testname"
],
"resetMocks": true
},
"eslintConfig": {
"extends": "react-app"
}
}
and now if i want to install a new dependency or library such as installing "@react-pdf/renderer" , than i am having the following issue :
npm error code ERESOLVE
npm error ERESOLVE unable to resolve the dependency tree
npm error
npm error while resolving: u4rad-report@1.0.0
npm error Found: @jsonforms/core@2.5.2
npm error node_modules/@jsonforms/core
npm error @jsonforms/core@"^2.5.2 from the root project
npm error
npm error could not resolve dependency:
npm error peer @jsonforms/core@"3.3.0" from @jsonforms/react@3.3.0
npm error node_modules/@jsonforms/react
npm error @jsonforms/react@"^3.2.1" from the root project
npm error
npm error Fix the upstream dependency conflict, or retry
npm error this command with --force or --legacy-peer-deps
npm error to accept an incorrect (and potentially broken) dependency resolution.
npm error
npm error
npm error For a full report see:
npm error C:\Users\hp\AppData\Local\npm-cache_logs\xxx-report.txt

npm error A complete log of this run can be found in: (log directory)

Even after resolving this i am getting a new error which says version conflicts in new errors and so on
If anyone can help me in this, thanks in advance.


This content originally appeared on DEV Community and was authored by Himanshu Jangid


Print Share Comment Cite Upload Translate Updates
APA

Himanshu Jangid | Sciencx (2024-08-24T06:20:43+00:00) Version Conflicts in the Package.json file. Retrieved from https://www.scien.cx/2024/08/24/version-conflicts-in-the-package-json-file/

MLA
" » Version Conflicts in the Package.json file." Himanshu Jangid | Sciencx - Saturday August 24, 2024, https://www.scien.cx/2024/08/24/version-conflicts-in-the-package-json-file/
HARVARD
Himanshu Jangid | Sciencx Saturday August 24, 2024 » Version Conflicts in the Package.json file., viewed ,<https://www.scien.cx/2024/08/24/version-conflicts-in-the-package-json-file/>
VANCOUVER
Himanshu Jangid | Sciencx - » Version Conflicts in the Package.json file. [Internet]. [Accessed ]. Available from: https://www.scien.cx/2024/08/24/version-conflicts-in-the-package-json-file/
CHICAGO
" » Version Conflicts in the Package.json file." Himanshu Jangid | Sciencx - Accessed . https://www.scien.cx/2024/08/24/version-conflicts-in-the-package-json-file/
IEEE
" » Version Conflicts in the Package.json file." Himanshu Jangid | Sciencx [Online]. Available: https://www.scien.cx/2024/08/24/version-conflicts-in-the-package-json-file/. [Accessed: ]
rf:citation
» Version Conflicts in the Package.json file | Himanshu Jangid | Sciencx | https://www.scien.cx/2024/08/24/version-conflicts-in-the-package-json-file/ |

Please log in to upload a file.




There are no updates yet.
Click the Upload button above to add an update.

You must be logged in to translate posts. Please log in or register.