Nativebase: Icons is not showing

[nameer94]

Icons is not showing it shows something like this ▯ only.
react-native: 0.60.4
native-base: 2.12.2
I tried npm install --save react-native-vector-icons but nothing changed :/

[dl-husky73]

same issues with 2.12.3

[mwq27]

Same problem with

    "native-base": "^2.13.0",
    "react": "16.8.3",
    "react-native": "0.59.10",
    "react-native-navigation": "2.25.0",
    "styled-components": "^4.3.2"

I tried FontAwesome and AntDesign, both just showing the X. I'm running in Android Simulator.

[hectorthiele]

Same Issue with:
"native-base": "^2.12.2",
"react": "16.8.6",
"react-native": "0.60.4",

[nameer94]

I found the solution
https://github.com/oblador/react-native-vector-icons/issues/661#issuecomment-378546936

just add this code to app/build.gradle
apply from: "../../node_modules/react-native-vector-icons/fonts.gradle"

[kaminaly]

Same Issue with:
"native-base": "^2.12.2",
"react": "16.8.6",
"react-native": "0.60.4",

I've fixed it with copying fonts manually
oblador/react-native-vector-icons#661 (comment)

[mwq27]

@nameer94's solution worked for me.

[tomchomiak]

At this moment, auto linking for react-native-vector-icons in react native 0.60 isn't working. You can copy the fonts manually or here's another solution that worked for me:

1.) Uninstall react-native-vector-icons using npm or yarn

npm uninstall react-native-vector-icons --save

2.) cd into your ios folder and rerun pod install

cd ios
pod install
cd ../

3.) Reinstall react-native-vector-icons using npm or yarn and link the icons manually

npm install react-native-vector-icons --save
react-native link react-native-vector-icons

4.) Restart your simulators for good measure and rerun your app

react-native run-ios
react-native run-android

[PlabanJr]

Hope this resolves the issue. Feel free to create a new issue if the issue persists. Also check out our latest release v2.12.5.

Thank you!

[r0b0t3d]

@PlabanJr This issue still persists on 2.13.5. I think this issue came when you did refactor deprecated lifecycle methods.
In IconNB.js

componentDidUpdate(nextProps) {
    if (nextProps.type && this.props.type !== nextProps.type) {
      this.setIcon(nextProps.type);
    }
  }

should be

componentDidUpdate(prevProps) {
    if (prevProps.type && this.props.type !== prevProps.type) {
      this.setIcon(this.props.type);
    }
  }

Please correct if I am wrong.

[khasky]

I confirm that react-native-vector-icons is not working in auto-linking mode for react-native 0.61.1.
In addition to @tomchomiak answer, you have to create react-native.config.js file with the following content:

module.exports = {
  dependencies: {
    'react-native-vector-icons': {
      platforms: {
        android: null
      }
    }
  }
};

[mufaddalhamidofficial]

@khasky where to create that file??

[danlupascu]

@mufaddalhamidofficial In the root folder of your app

[mufaddalhamidofficial]

what about expo...
@khasky will this work with expo

[andresteje]

apply from: "../../node_modules/react-native-vector-icons/fonts.gradle"

Its worked for me

[ramanasak]

I found the solution
oblador/react-native-vector-icons#661 (comment)

just add this code to app/build.gradle
apply from: "../../node_modules/react-native-vector-icons/fonts.gradle"

this worked for me, Thanks !

[ajaymarathe9]

I found the solution
oblador/react-native-vector-icons#661 (comment)

just add this code to app/build.gradle
apply from: "../../node_modules/react-native-vector-icons/fonts.gradle"

It's working Guys. thanks.

[zanotta]

I found the solution
oblador/react-native-vector-icons#661 (comment)
just add this code to app/build.gradle
apply from: "../../node_modules/react-native-vector-icons/fonts.gradle"

It's working Guys. thanks.

Yep, this solution worked for me.

[AdrianMrn]

apply from: "../../node_modules/react-native-vector-icons/fonts.gradle" wasn't working for me.

I had to copy all the font files from node_modules/native-base/Fonts to android/app/src/main/assets/fonts.