I'm currently working on setting up Webpack and Babel for utilizing React without Create React App (CRA).
While trying to install webpack-dev-server, I encountered some dependency issues.
PS C:\Users\Lebedev\Desktop\projects\frontend-graduation-project> npm install --save-dev webpack-dev-server
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! Found: <a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="86f1e3e4f6e7e5edc6b3a8b2a8b6">[email protected]</a>
npm ERR! node_modules/webpack
npm ERR! peer webpack@">=2" from <a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="afcdcecdcac382c3c0cecbcaddef97819d819e">[email protected]</a>
npm ERR! node_modules/babel-loader
npm ERR! dev babel-loader@"^8.2.1" from the root project
npm ERR! peer webpack@"^4.27.0 || ^5.0.0" from <a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="791a0a0a541516181d1c0b394c57495748">[email protected]</a>
npm ERR! node_modules/css-loader
npm ERR! dev css-loader@"^5.0.1" from the root project
npm ERR! 6 more (html-webpack-plugin, style-loader, ...)
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer webpack@"^4.0.0" from <a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="5c2b393e2c3d3f377138392a713135383830392b3d2e391c6f726b726e">[email protected]</a>
npm ERR! node_modules/webpack-dev-server/node_modules/webpack-dev-middleware
npm ERR! webpack-dev-middleware@"^3.7.2" from <a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="f285979082939199df969784df819780849780b2c1dcc3c3dcc2">[email protected]</a>
npm ERR! node_modules/webpack-dev-server
npm ERR! dev webpack-dev-server@"*" 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\Lebedev\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\Lebedev\AppData\Local\npm-cache\_logs\2020-11-15T12_42_34_324Z-debug.log
PS C:\Users\Lebedev\Desktop\projects\frontend-graduation-project>
Here's my package.json file:
"dependencies": {
"react": "^17.0.1",
"react-dom": "^17.0.1"
},
"devDependencies": {
"@babel/core": "^7.12.3",
"@babel/preset-env": "^7.12.1",
"@babel/preset-react": "^7.12.5",
"babel-loader": "^8.2.1",
"css-loader": "^5.0.1",
"html-webpack-plugin": "^4.5.0",
"style-loader": "^2.0.0",
"webpack": "^5.4.0",
"webpack-cli": "^4.2.0"
}
Here are the steps I've taken so far that have not resolved the issue:
- Attempted to delete the node_modules folder
- Attempted to delete the package-lock.json file
- Reinstalled npm dependencies by running this command: npm install
Any advice on how to solve these problems would be greatly appreciated.