unable to use Font Awesome Icons in React Native

Question

I am trying to use font awesome icons in my app but only some of them work while others give an error and show up as a question mark.

For example, these work:

import Icon from 'react-native-vector-icons/FontAwesome';

            <Icon
              name="user"
              style={styles.userIcon}
              size={moderateScale(20)}
            />
            <Icon name="star" size={moderateScale(13)} />

But this does not:

<View>
          <Icon name="smoking" color="green"></Icon>
        </View>

Even though all of these icons are present here in this directory:

https://fontawesome.com/icons?d=gallery&q=smoking

Secondly, how can I use the light version of an icon? For example, the user icon that I am using is filled. How can I change it to the light one as shown in the directory search? Both of them have same names.

Answer 1

There is this page to look at the icons that react-native-vector-icons has. You can clearly see that smoking icon is not part of FontAwesome. In order to use it, you have to use FontAwesome5.

On the other hand, for the outlined version you need to look for its name variant. For example, for using an outlined (or light as you refer to it) variant of the star icon, you gotta use star-o