React-native-vector-icons: RNVectorIconsManager not available, did you add library to your project and link with libRnVectorIcons.a

[jasan-s]

using "react-native": "0.42.0" & "react-native-vector-icons": "^4.0.0", & Xcode 8.2.1

still getting this error after install and running react-native link . Is the process not automatic?

[jasan-s]

I have checked plist and it has all the fonts in array. and libRNVectorIcons.ais showing under build phases but it is red.

[jjhesk]

same here

[Gavinwei]

@jasan-s How do you solve the problem?

[jasan-s]

@Gavinwei I never did. Still have this issue.

[oblador]

@jasan-s: Looks right to me, did you also recompile?

[jasan-s]

I cleaned and build the project again multiple times. I removed the build folder multiple times. I re started the packager with --reset-cache and reset and closed the iOS simulator multiple times. I tried removing all the required vector icons files and adding them multiple times. I have tried removing the re-adding the node_modules.

I am using react-native fbsdk , so not sure if that is the cause. On Android the vector icons work great. The problem is only on iOS.

[oblador]

Hmm, have you tried running the project from Xcode instead of the terminal? That sometimes yield different results because of caching. Does the example projects work?

[johncblandii]

Same here. I loathe updating dependencies. This lib always puts me in a blocked state.

[juanviola]

I'm having same issue, did someone fixed? Thanks

[johncblandii]

I got rid of the cocoapods. It just isn't easy to upgrade this repo consistently with it, but it may be more about react-native link integration than anything.

[oblador]

@johncblandii: To bad you feel like this lib blocking you. I put effort into making it backwards compatible when possible, clearly mark any updates that are not in the release notes and try to adhere to semver. But I'm afraid react-native itself causes breakage more frequently than desired. If you think I've made an error please point me to it and I'll try to improve for the future, but please don't just dismiss the project as unreliable if the blame is elsewhere. I've myself never needed to do anything special when upgrading this library using cocoapods.

[johncblandii]

It is frustrating, @oblador, but I do believe it is more RN than this repo. I think you've done a great job providing a seriously quality library. If you read above, I noted using cocoapods with this lib makes for very flaky uprades and specifically said "it may be more about react-native link integration than anything."

So I am not dismissing this lib by any stretch. It is worth noting other libraries I use do not have the same problems as this one. There are some that do, though; hence the above quote.

[oblador]

Is this still an issue? Not sure how to fix it except with better README, but then I'm not sure what steps needs improvements.

[johncblandii]

We're good now that I don't use the cocoapods version.

[johncblandii]

I'm just curious if anyone tested with RN 0.47 + cocoapods.

It seemed these two commits might could resolve the issues I saw w/ pods:
https://github.com/facebook/react-native/commit/0877f2c4def106319035a869a47ad02ba3abd050
https://github.com/facebook/react-native/commit/f3f44eee59e8991e197c854e5fee719105c045cd

[systemlevel]

Experiencing the same issue. Console output "Error: RNVectorIconsManager not available, did you add the library to your project and link with libRNVectorIcons.a? Try running react-native link react-native-vector-icons and recompiling."

Tried suggestions above as well as avoiding the use of cocoapods.

[oblador]

@systemlevel: the link phase you're showing is not for your project, click on s2h_mobile and ensure you're linking there.

[systemlevel]

@oblador Thank you for catching that. That fixed the issue.

[oblador]

I'm going to close this, please open a PR with proposed documentation changes if you think they are still unclear.

[chrismllr]

I am getting the same issue, but only when running component tests with Jest - Is there an example mock for testing purposes?

[sfratini]

@chrismllr or to anyone reaching here because you are testing with jest and testing the getImageSource, you can mock that function like this (point to any icon):

import {
    NativeModules,
  } from 'react-native';

NativeModules.RNVectorIconsManager = {
    getImageForFont: function getImageForFont(fontFamily, glyph, fontSize, color, callback) {
        return callback(null, require('../app/resources/icons/icon.png'));
    }
}

[jwrubel]

I just came across this issue because I needed to mock getImageSource. A slightly-different syntax from what @sfratini posted above worked for me:

import { NativeModules } from 'react-native'

jest.mock('NativeModules', () => {
  return {
    RNVectorIconsManager: {
      getImageSource: function getImageSource(fontFamily, glyph, fontSize, color, callback) {
        return callback(null, require('../app/resources/icons/icon.png'));
      }
    },
  };
});

The trick was understanding that we're not mocking react-native-vector-icons here, we're mocking the underlying NativeModule.

[alvelig]

jest.mock('react-native-vector-icons/Ionicons', () => 'Icon');

(Credits https://github.com/oblador/react-native-vector-icons/issues/351#issuecomment-266474629)