import error when using react-icons

When you use the v3 way of importing the icons, you should not have lib be a part of the import path.

The icons also have the icon library name as prefix for the export.

import { FaCalendar } from 'react-icons/fa'

Not all the fa icons are free. I was getting this error when I was trying to import the paid icon of pencil as below.

import { FaPencil } from 'react-icons/fa'

If you see here for all the fa icons, you can see that the pencil needs the pro license.

As I was not having a pro license, I was getting the error. But we can always use the free versions of pencil, and we just need to import it as below.

import { FaPencilAlt } from 'react-icons/fa'
<button><FaPencilAlt /></button>

You should also check the implementation of your version from here.

After looking through the icon directories react-icons/[fa,ti,md] and looking at the index.dt.ts file for the new names of the icons I came up with your answer.

import { MdTerrain } from "react-icons/md";
import { TiWeatherSnow } from "react-icons/ti";
import { FaCalendarAlt } from "react-icons/fa";

To use the icons in your component use the tags:

<FaCalendarAlt />
<TiWeatherSnow />
<MdTerrain />

For an explanation look at the Migration from version 2-> 3 on the react-icon page. https://www.npmjs.com/package/react-icons