1

I am trying to use react-icon FaStar in an app. I first created a component in a separate create-react-app and used FaStar successfully in that install. Then I transported the .js and .cs files to the create-react-app that I am developing.

After using npm install react-icon and I get

Attempted import error: 'FaStar' is not exported from 'react-icons/fa'.

When I look at node_modules/react-icon/fa/index.js all I see is

/ THIS FILE IS AUTO GENERATED
var GenIcon = require('../lib').GenIcon

In the installation where I developed the component, I see react-icon/fa/index.js file full of code in vi

Any idea why this is happening? Thanks

Oss Kell
  • 53
  • 6

2 Answers2

0

The solution for this problem was rebuilding the project create-react-app by installing react-icons before all the other dependencies. One must have been interfering(probably http-proxy-middleware) with react-icons install.

Here are the dependencies from package.json

"dependencies": {
    "@testing-library/jest-dom": "^5.14.1",
    "@testing-library/react": "^11.2.7",
    "@testing-library/user-event": "^12.8.3",
    "axios": "^0.22.0",
    "http-proxy-middleware": "^2.0.1",
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
    "react-hot-loader": "^4.13.0",
    "react-icons": "^4.3.1",
    "react-scripts": "4.0.3",
    "web-vitals": "^1.1.2"
  },
Oss Kell
  • 53
  • 6
0

I found a solution. You can try importing import { FaUser } from 'react-icons/fa6'; instead of import { FaUser } from 'react-icons';. This worked for me.

Syed Junaid
  • 1
  • 1
  • Your answer could be improved with additional supporting information. Please [edit] to add further details, such as citations or documentation, so that others can confirm that your answer is correct. You can find more information on how to write good answers [in the help center](/help/how-to-answer). – Community Jun 24 '23 at 16:57