Usage
import { FaBeer } from 'react-icons/fa';
class Question extends React.Component {
render() {
return <h3> Lets go for a <FaBeer />? </h3>
}
}
Docs.
Questions tagged [react-icons]
146 questions
3
votes
0 answers
Iconify React with Eva icons showing typescript error
I'm getting this issue:
Property 'fr' is missing in type '{ icon: IconifyIcon; }' but required in type 'Pick
Abhijit Desai
- 147
- 1
- 5
3
votes
2 answers
Cant use React Icons component as an object value typescript
I am developing a personal website using typescript and react, and for my footer, I am mapping through an array of objects which each have a url property, as well as an icon property. The Icon property is supposed to have multiple different React…
Brady
- 153
- 2
- 7
3
votes
2 answers
show reactjs icons dynamically icon names picking from JSON file
I'm having following json file, which I keep Id,Intro, Icon name
[
{
"id" : 7,
"intro": "intro_7",
"icon" : "ArrowRight"
},
{
"id" : 8,
"intro": "intro_8",
"icon" : "Alarm"
…
Kelum
- 1,745
- 5
- 24
- 45
3
votes
2 answers
react-icons - Can't change color Grommet icons
I'm using react-icons and with Font Awesome icons I managed to change color easily with 2 approaches:
Works with color prop:
nanquim
- 1,786
- 7
- 32
- 50
3
votes
1 answer
React - Generating different Icons within a map function
I have a sidebar components whose list items are generated inside of a map function (movie genres fetched from an api). I would like to have a different icon next to each of the movie genres but have been unable to figure out a way to create a…
yaboi-hugh
- 163
- 3
- 10
3
votes
1 answer
How do i dynamically create JSX tag in React using typescript?
I want to import react-icons dynamically.
This works in Javascript, but how do i convert this to Typescript without getting all sorts of errors?
Code:
import * as ReactIcons from 'react-icons/all';
const getIcon = (icon) => {
const TagName =…
2
votes
0 answers
Implement dynamic import for 'react-icons' in NextJS app
I am using NextJS and trying to dynamically (using a param) to import the related icon library from 'react-icons' npm package.
Knowing that for ie. the icon FaAws from 'fa' library can be imported as the follow :
import { FaAws } from…
Youssef
- 401
- 1
- 5
- 23
2
votes
1 answer
React icons size is HUGE
I'm using React Icons in my website, and I've noticed that the package is quite large - almost 9MB In the network tab of developer tools (it's making the website taking much time to load on slow internet).
However, I'm only using a few icons at…
Saybers
- 39
- 5
2
votes
0 answers
Module not found: Can't resolve 'react-icons/lib'
I forked react-icons in an attempt to potentially contribute. I went through the process detailed in the github repository notes on how to contribute and preview, and I keep getting this error after running yarn start.
ready - started server on…
Patrick Skinner
- 21
- 1
2
votes
2 answers
React icons Incompatible with react native navigation
I want to use this icon from React icons= HiOutlineMenuAlt1 as my drawer icon in react native navigation. However i try to use as shown below it brings an error(see below)
Note: This error happens with all icons when used in the navigation
Minimal…
louis
- 422
- 1
- 4
- 14
2
votes
4 answers
Module not found: Can't resolve 'react-icons/ai'
I am learning ReactJS. But now I got a problem. I used this code
import { AiOutlineShoppingCart } from "react-icons/ai"
But it is showing this error:
Module not found: Can't resolve 'react-icons/ai'
I am using sanity to build an eCommerce website…
AK9
- 41
- 1
- 4
2
votes
1 answer
React js - Unable to use react-icons, Module not found '../lib'
This is my first post on stackoverflow so I will try my best to keep it short, sweet, and detailed enough to hopefully find some assistance.
I'm currently trying to learn React js and when I try to install react-icons and import an Icon, my dev…
Chiken
- 23
- 6
2
votes
2 answers
error:styled_components__WEBPACK_IMPORTED_MODULE_0__.default.FaChevronRight is not a function
**import styled from 'styled-components';
import { FaChevronRight } from 'react-icons/fa';
const ButtonSty = styled.button`
width:128px;
height:32px;
border:2px solid #074EE8;
box-sizing:border-box;
border-radius:4px;
`
const Ancor =…
Sava
- 113
- 1
- 13
2
votes
1 answer
Why is yarn throwing an error after installing babel-loader?
After I installed the react-icons package, my code threw an error saying my babel-loader was missing, so I installed that package too.
Next thing I knew, I ran yarn start and this error came up:
Assertion failed: (napi_create_string_utf8(env,…
michelle tan
- 95
- 10
2
votes
2 answers
How to render react-icon depending on String from Database?
I am trying to create multiple boxes with information and every box has an Icon. Right now I have hard-coded this as following:
Cryptorian420
- 25
- 2
- 5