title: Material UI svg Icon: Module not found: Error: Can't resolve '@material-ui/icons/...'
body: <pre><code>ERROR in ./src/components/navigator/Navigator.tsx
  Module not found: Error: Can't resolve '@material-ui/icons/DnsRounded' in '.../src/components/navigator'
   @ ./src/components/navigator/Navigator.tsx 36:0-59 53:30-44
   @ ./src/components/App.tsx
   @ ./src/index.tsx
  </code></pre>
  
  <p>Current dependencies:</p>
  
  <pre><code>"dependencies": {
      "@material-ui/core": "^4.6.0",
      "@material-ui/icons": "^4.5.1",
      "core-js": "^3.4.0",
      "react": "^16.10.2",
      "react-dom": "^16.10.2",
      "react-redux": "^7.1.1",
      "redux": "^4.0.4",
      "redux-devtools-extension": "^2.13.8",
      "redux-thunk": "^2.3.0"
    }
  </code></pre>
  
  <p>one of the example import I did in the Navigator.tsx is:</p>
  
  <pre class="lang-js prettyprint-override"><code>import HomeIcon from '@material-ui/icons/Home';
  
  // in render method:
  &lt;HomeIcon /&gt;
  </code></pre>
  
  <p>Things I have tried to fix this issue:<br>
  1. npm i @material-ui/icons@latest (next, old 3.x.x versions, etc)<br>
  2. reinstall the dependencies.<br>
  3. add icon link to index.html.<br>
  So far none of them have worked. I keep getting the module not found error while compiling. I also checked the node_modules, I can find the <strong>@material-ui/icons</strong> package in there. Moreover, I can use cmd + click to navigate to the source code in my VSCode.</p>
  
  <p>Again, I am trying to use the SVG Icon instead of the Font Icon.</p>