Search code examples
reactjsiconsreact-nativevector-icons

import Icon from 'react-native-vector-icons/Ionicons'

Can I import react-native-vector-icons/font-awesome and react-native-vector-icons/Ionicons on same screen? Basically I want to use both font-awesome and Ionicons icons on same screen for different icons?

Example-
import ActionButton from 'react-native-action-button';
import Icon from 'react-native-vector-icons/font-awesome';
import Icon from 'react-native-vector-icons/Ionicons';
Solution

  • Yes, you can. Because FontAwesome and Ionicons are exported as defaults, you can import them with any name, like so

    import FontAwesomeIcon from 'react-native-vector-icons/FontAwesome';
import IonIcon from 'react-native-vector-icons/Ionicons';

    and in your render() method use like

    <FontAwesomeIcon name="github" size={16} color="red">
<IonIcon name="github" size={16} color="blue">