Questions tagged [react-font-awesome]
48 questions
1
vote
3 answers
React.js:How to send Fontawsome icon as props?
I using this object as React.js component props. but after sent it, FontAwsome could not find passed icon
{
key: 'editButton',
title: 'Edit',
icon: 'faEdit',
function: null,
type: 'default ',
},
{
key:…
Rohullah Rajaee Rad
- 571
- 2
- 9
- 33
1
vote
1 answer
React Fontawesome CSS pseudo element not rendering inside div but works in Codepen
I'm running a React application and I need to render a FontAwesome icon inside of a select form field like in this Codepen
To achieve this, I'm using CSS Pseudo Elements, :after to be specific as defined here
Unfortunately, this works well inside of…
Tony Olendo
- 137
- 1
- 16
1
vote
1 answer
React-FontAwesome unicode values in svg circle
I am trying to embed a font awesome icon inside svg circles via unicode values from the font awesome website inside , but they fail to appear:
for some reason which I don't understand, when I am using this unicode value(✓) it does…
ClovisIRex
- 43
- 1
- 9
0
votes
2 answers
How do I pull in all icons from FontAwesome 5 for a React/Typescript app?
I know that there is a font awesome cheat sheet that lists all the icons, however pulling in by class name fails for me. Something like the below is producing a console error that it cannot find the icon.
Isabella
- 21
- 2
0
votes
0 answers
Hosting Font Awesome Pro icons locally - Duotone both colors not showing
I cannot get both colors of my duotone icon to show up. I have Font Awesome 6.3 pro in my project. I downloaded the entire 'fontawesome-pro-6.3.0-web' folder and tossed it in my assets folder. Then I am importing it into the main.tsx file, I am…
dmikester1
- 1,374
- 11
- 55
- 113
0
votes
0 answers
How to use uploaded fontawsome custom icons in react
We are using fontawesome in our react app, so obviously we are doing it in the react way as says their docs here.
In our app , i'm importing these icons libraries :
import * as proSolidSvgIcons from "@fortawesome/pro-solid-svg-icons";
import * as…
Bardelman
- 2,176
- 7
- 43
- 70
0
votes
1 answer
error trying to install font awesome via npm
When I am installing font awesome via terminal (npm i --save @fortawesome/fontawesome-svg-core) as recommended in the docs, I'm getting this error:
npm ERR! code E401
npm ERR! Incorrect or missing password.
npm ERR! If you were trying to login,…
lordpotato89
- 3
- 2
0
votes
0 answers
Not able to load icons in a client side component
I have started a new NextJs app (with the beta app feature) and it doesn't seem to be able to load icons when in a client side component.
It is throwing errors like Could not find icon { prefix: 'far', iconName: 'home' }
I am using the…
OnIIcE
- 811
- 9
- 27
0
votes
1 answer
React FontAwesome - problem on loading fa-thin
Trying to use FontAwesome icons on React but I am having some issues on importing the files correctly.
First I installed some dependencies and I am now able to import the component as follow
import { FontAwesomeIcon } from…
giaggi
- 542
- 5
- 16
0
votes
0 answers
How to add SVG from Fontawesome react code snippet in React app?
I am using CSS module. Does it affect in how to add the Font awesome icon?
I already installed all the required dependencies.
nav.js
import React from "react";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import classes from…
rlopxhan21
- 51
- 4
0
votes
0 answers
npm WARN ERESOLVE overriding peer dependency
I am trying to update react and react-dom from 17.0.2 to 18.0.2 in a component library project.
I get an error npm WARN ERESOLVE overriding peer dependency
The peerDependency is react@">=16.3".
18.0.2 >= 16.3, so why would this be an error?
$> npm…
user210757
- 6,996
- 17
- 66
- 115
0
votes
1 answer
How to vertically align react font awesome icons
I am using react font awesome package and it is so annoying to see that some icons do not align vertically properly and tend to be lifted up higher than
As you can above, i scaled the react font awesome icon to 60px and it looks awful
here is how i…
uberrebu
- 3,597
- 9
- 38
- 73
0
votes
1 answer
Font Awesome icons on React Js Project
According to Font Awesome documentation, I followed this example below but didn't get any result. I used font awesome a lot of time on my html project in the past. But this is for the first time I am using it on my React Application. How can I get…
Ferdous Hasan
- 48
- 5
0
votes
2 answers
Convert Font Awesome pro icons to be hosted locally in React project
I just found out that we can not use the hosted repo for Font Awesome if we don't pay the yearly subscription for the pro icons. So I need to host locally. I am following the instructions here:…
dmikester1
- 1,374
- 11
- 55
- 113
0
votes
1 answer
Fontawesome Icon not working as state value on React with TS
I am using an icon dynamically, so I would change the type of the icon with a state update, but I'm getting this error:
Type 'string' is not assignable to type 'IconPrefix'.
Here is a sample of my code:
import { useState } from 'react'
import {…
Berg_Durden
- 1,531
- 4
- 24
- 46