hirarqi
hirarqi

Reputation: 281

Implement Icon In React Native

I have seen in several articles about applying icons to this react native, but on my way I found an error. it's clearer like this

Step that i did :

  1. npm intall react-native-vector-icons --save

then in Example.js

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

export defaul class App extends React.Component {
   render(){ 
       return(       
          <Icon name='person-outline' type="MaterialIcons" />
       )
   }
}

after I got here I tried it, but the icon didn't work. then I read a few articles, and needed to execute the following command. and i do

react-native link react-native-vector-icons

and I tried again. and this works. the icon appears. but in the command I get an error. more or less error like this

** error React Native CLI uses autolinking for native dependencies, but the following modules are linked manually: - react-native-vector-icons (to unlink run: "react-native unlink react-native-vector-icons") **

what should i do??

Upvotes: 0

Views: 297

Answers (1)

Akila Devinda
Akila Devinda

Reputation: 5472

In your scenario once you are using React Native Version 0.60 or above you don't need to link packages manually. Autolinking will do that for you

If you need to remove this warning try this command

react-native unlink react-native-vector-icons

If you are still using React Native version 0.59 or less then you need to link those packages.

EXTRA

But you can also disable autolinking for unsupported library

During the transition period some packages may not support autolinking on certain platforms. To disable autolinking for a package, update your react-native.config.js's dependencies entry to look like this:

// react-native.config.js

module.exports = {
  dependencies: {
    'some-unsupported-package': {
      platforms: {
        android: null, // disable Android platform, other platforms will still autolink if provided
      },
    },
  },
};

Upvotes: 1

Related Questions