This Byte aims to help you understand and fix this error.
Why do you get this error?
The "Module not found: Can't resolve 'react-icons'" error typically occurs when the react-icons package is not installed correctly or is missing from your project's dependencies.
This package is a popular choice for adding icons to your React projects, and this error means your application can't find it in the
One way to resolve this error is by reinstalling your dependencies. You might want to do this because, while react-icons is listed as a dependency, it might not actually be installed.
Start by deleting the
node_modules directory and the
package-lock.json file in your project root.
$ rm -rf node_modules
$ rm package-lock.json
After deleting, reinstall your dependencies using npm or yarn.
$ npm install
This process will create a fresh
node_modules directory and
yarn.lock file. It ensures that all your dependencies, including react-icons, are actually installed.
Verify "react-icons" is a Dependency
Another thing you should do is to check the
package.json file for your project. In case you're not aware, this file contains a list of all the dependencies your project needs. If react-icons is not listed in the
dependencies object, you need to install it.
$ npm install --save react-icons
$ yarn add react-icons
After running one of these commands, react-icons should be added to your
package.json file and
node_modules directory, and the error should be resolved.
Note: Always remember to restart your development server after installing new dependencies. This allows your application to recognize and use the newly installed packages.
In this Byte, we showed how to resolve the "Module not found: Can't resolve 'react-icons'" error in React applications. This error typically occurs when the react-icons package is missing or not actually installed, and we also showed a few ways to resolve it.