webpack not able to resolve node_modules material-icons

Question

Here is the error I am getting

ERROR in ./node_modules/material-icons/iconfont/material-icons.css (./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].oneOf[5].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[1].oneOf[5].use[2]!./node_modules/source-map-loader/dist/cjs.js!./node_modules/material-icons/iconfont/material-icons.css)

Module build failed (from ./node_modules/source-map-loader/dist/cjs.js):
Error: ENOENT: no such file or directory, open 'C:\Users\perso\Desktop\slick_react\node_modules\material-icons\iconfont\material-icons.css'

However I uninstalled material-icons before this and this is my package.json

{
  
  "dependencies": {
    "@fortawesome/fontawesome-svg-core": "^6.2.0",
    "@fortawesome/free-solid-svg-icons": "^6.2.0",
    "@fortawesome/react-fontawesome": "^0.2.0",
    "@testing-library/jest-dom": "^5.16.5",
    "@testing-library/react": "^13.4.0",
    "@testing-library/user-event": "^13.5.0",
    "chart.js": "^3.9.1",
    "react": "^18.2.0",
    "react-chartjs-2": "^4.3.1",
    "react-dom": "^18.2.0",
    "react-scripts": "5.0.1",
    "slick-carousel": "^1.8.1",
    "web-vitals": "^2.1.4"
  },

}

I tried installing however it is not getting re installed and still my page stopped rendering.

Answer 1

There must be some uninstalled packages that are probably conflicting. What you should try doing in my idea is:

1. delete the node_modules folder
2. run yarn/npm install whatever you're using to re-install packages
3. Then add the required packages for material-ui again with the --save flag. This should probably work!