Search code examples
javascriptcssreactjsresolvereact-icons

React icons are not resolved

Failed to compile.

Module not found: Error: Can't resolve 'react-icons/ai' in 'C:\Users\janan\OneDrive\Desktop\dukaan\nishyan\src\components'
ERROR in ./src/components/Navbar.jsx 5:0-57
Module not found: Error: Can't resolve 'react-icons/ai' in 'C:\Users\janan\OneDrive\Desktop\dukaan\nishyan\src\components'

ERROR in ./src/components/Navbar.jsx 6:0-49
Module not found: Error: Can't resolve 'react-icons/io' in 'C:\Users\janan\OneDrive\Desktop\dukaan\nishyan\src\components'

ERROR in ./src/components/Navbar.jsx 7:0-50
Module not found: Error: Can't resolve 'react-icons/ri' in 'C:\Users\janan\OneDrive\Desktop\dukaan\nishyan\src\components'

ERROR in ./src/components/Navbar.jsx 8:0-42
Module not found: Error: Can't resolve 'react-icons/fa' in 'C:\Users\janan\OneDrive\Desktop\dukaan\nishyan\src\components'

ERROR in ./src/components/Sidebar.jsx 6:0-48
Module not found: Error: Can't resolve 'react-icons/io' in 'C:\Users\janan\OneDrive\Desktop\dukaan\nishyan\src\components'

ERROR in ./src/components/Sidebar.jsx 7:0-40
Module not found: Error: Can't resolve 'react-icons/fa' in 'C:\Users\janan\OneDrive\Desktop\dukaan\nishyan\src\components'

ERROR in ./src/components/Sidebar.jsx 8:0-56
Module not found: Error: Can't resolve 'react-icons/hi' in 'C:\Users\janan\OneDrive\Desktop\dukaan\nishyan\src\components'

ERROR in ./src/components/Sidebar.jsx 9:0-50
Module not found: Error: Can't resolve 'react-icons/ti' in 'C:\Users\janan\OneDrive\Desktop\dukaan\nishyan\src\components'

ERROR in ./src/components/Sidebar.jsx 10:0-49
Module not found: Error: Can't resolve 'react-icons/ci' in 'C:\Users\janan\OneDrive\Desktop\dukaan\nishyan\src\components'

ERROR in ./src/components/Sidebar.jsx 12:0-49
Module not found: Error: Can't resolve 'react-icons/pi' in 'C:\Users\janan\OneDrive\Desktop\dukaan\nishyan\src\components'

ERROR in ./src/components/Sidebar.jsx 13:0-44
Module not found: Error: Can't resolve 'react-icons/md' in 'C:\Users\janan\OneDrive\Desktop\dukaan\nishyan\src\components'

ERROR in ./src/components/Sidebar.jsx 14:0-49
Module not found: Error: Can't resolve 'react-icons/lu' in 'C:\Users\janan\OneDrive\Desktop\dukaan\nishyan\src\components'

ERROR in ./src/components/Sidebar.jsx 16:0-41
Module not found: Error: Can't resolve 'react-icons/fi' in 'C:\Users\janan\OneDrive\Desktop\dukaan\nishyan\src\components'

ERROR in ./src/components/Sidebar.jsx 17:0-72
Module not found: Error: Can't resolve 'react-icons/io5' in 'C:\Users\janan\OneDrive\Desktop\dukaan\nishyan\src\components'

ERROR in ./src/components/Sidebar.jsx 19:0-30
Module not found: Error: Can't resolve './Body.jsx' in 'C:\Users\janan\OneDrive\Desktop\dukaan\nishyan\src\components'

webpack compiled with 15 errors

I gave all these commands but still I receive these errors idk install npm i react-icons

npm install
npm update
npm install @react-icons/all-files --save
npm install react-icons --save

any one please help me how to correct this error. this happens every time ..

Solution

  • first of all there is no need to install @react-icons/all-files package just run the command

    npm install react-icons --save // if using npm
yarn add react-icons // if using yarn

    then you can simply use like following

    import { FaBeer } from 'react-icons/fa';

const Example = () =>  {
    return <h2> fa bear <FaBeer /> </h2>
}

    if it doesn't work then try to delete and reinstall node_modules

    happy coding :)