React-fontawesome: Pro icons not showing

[michelecocuccio]

Hello,
I have used pro-icons with NPM before in a WordPress theme (Sage) and I have put the authToken on the .npmrc file as per the instruction provided and it worked. Now I have done the same thing in a React project but the pro icons don't work.

import { library } from '@fortawesome/fontawesome-svg-core'
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { faSpinner } from '@fortawesome/pro-light-svg-icons';

library.add(faSpinner);

<FontAwesomeIcon icon="spinner" spin size="3x" />

I have the .npmrc file in place and I have even set the authToken globally but pro-light and pro-regular don't work. If I import them from 'pro-solid-svg-icons' they work (and of course the free-solid as well).

Any idea?

[michelecocuccio]

Ok sorry, turns out that I should have used the other syntax using curly brackets
<FontAwesomeIcon icon={faSpinner} spin size="3x" />

[5tormTrooper]

I just ran into this issue too (trying to use a Pro light icon). If you're working the library approach, pass an array to the FontAwesomeIcon:

<FontAwesomeIcon icon={["fal", "spinner"]} />

The default is "fas".

38

[jimbits]

I was just about to reach for the scotch.... thanks

[saxxi]

Yepp, for Vue please use <font-awesome-icon :icon="['fal', 'spinner']" />, thanks @5tormTrooper.