The react-script package contains deprecated version of webpack and webpack-dev-server

Created by: haneenmahd

Describe the bug

React Script package contains the old version of webpack which causes error when starting the dev server in the system. The error shown was:

The react-scripts package provided by Create React App requires a dependency:     

  "webpack": "4.44.2"

Don't try to install it manually: your package manager does it automatically.
However, a different version of webpack was detected higher up in the tree:

  C:\Users\YourAccount\node_modules\webpack (version: 5.27.1)

Manually installing incompatible versions is known to cause hard-to-debug issues.

But, still when i followed the steps to fix this one shown below this error This thing still does the same.

Did you try recovering your dependencies?

Yes, I tried removing package-lock.json and node_modules and runned npm install on the terminal but this still happens

Environment

Environment Info:

  current version of create-react-app: 3.4.1
  running from C:\Users\CIVIL Dept\AppData\Roaming\npm\node_modules\create-react-app

  System:
    OS: Windows 10 10.0.18363
    CPU: (4) x64 Intel(R) Core(TM) i3-8130U CPU @ 2.20GHz
  Binaries:
    Node: 14.16.0 - C:\Program Files\nodejs\node.EXE
    Yarn: 1.22.10 - C:\Users\CIVIL Dept\AppData\Roaming\npm\yarn.CMD
    npm: 6.14.11 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Edge: 44.18362.449.0
    Internet Explorer: 11.0.18362.1
  npmPackages:
    react: ^17.0.2 => 17.0.2
    react-dom: ^17.0.2 => 17.0.2
    react-scripts: 4.0.3 => 4.0.3
  npmGlobalPackages:
    create-react-app: Not Found

Steps to reproduce

First create a React Project
Install webpack globally on your machine.
Try running npm start it would fail

Expected behavior

It Should bundle the code and start the dev server.

Actual behavior

Reproducible demo

Link - Semantic Tabs