React-native-fast-image: Warning: Native component for "FastImageView" does not exist

[lichenglu]

Thank you for the great work! I cannot wait to see it work on my end (^ ^)/

Here is my basic information:
MacOS Sierra
Expo 20.0.0
React Native 0.47.2

I installed the package following the instruction:

1. yarn add react-native-fast-image
2. react-native link

But when I use it, the terminal gives me this warning Warning: Native component for "FastImageView" does not exist, and NO image was shown, only red boxes. But if I change to React Native's Image component, things work as expected.

I wonder if it is because I am using expo? But I tried eject expo, and link again, but the warning persists, and no image was showing up. :(

[denny64]

+1

[rmanniez]

+1

[l-pa]

+1

[jankarres]

+1

Expo 20.0.0
React Native 0.47.2
npm 4.6.x

[pcooney10]

Projects that use react-native link are not compatible with Expo.

In order to use a library like this, you must detach your application and use ExpoKit.

More information can be found here:
https://docs.expo.io/versions/latest/guides/expokit.html#changing-native-dependencies

[pcooney10]

Also, you may want to consider this alternative:
https://github.com/wcandillon/react-native-img-cache

[solababs]

+1

[pcooney10]

@solababs +1 for what? The error?

This package will not work with Expo. Only an ejected app using ExpoKit.

[lichenglu]

@pcooney10 Sorry for the inconvenience. I opened this issue mainly because I failed to use the library after ejecting my expo app. Do I need to go to xcode for extra setup? Because I only ran react-native link after ejection.

[solababs]

@pcooney10 im not runnning on expo. im running in emulator and also tested on device. i get this red border and the image doesnt display. I used react-native-image-progress with it too and get the same result. on android tho.

[pcooney10]

My apologies - disregard my statement then.

I had looked into using this a while ago, and commented my two cents at the time (multiple people were referencing expo in their setup). I got a notification today and didn't read through the entire issue before posting.

I unfortunately do not have much experience with apps ejected from expo, but recall reading something about 'react-native link` not always playing nicely with CocoaPods. There is a brief note on it here: https://docs.expo.io/versions/latest/guides/expokit.html#ios.

This issue / PR might also be helpful (for those looking to use react-native link with ExpoKit projects): https://github.com/facebook/react-native/pull/15460. After a quick take, it seems that this should implemented in the coming version (v22), but I am not certain this will resolve your issue.

[jssprz]

+1

[psyanite]

+1 😞

[irfansener]

+1

[DylanVann]

What @pcooney10 said is correct, you cannot use this with a non-ejected app. This is because you cannot make native code additions or modifications when using expo.

[vitto-moz]

I don't use expo but have the same error. However, my app is not ejected - does this mean I should eject my app to use a library? Thanks!

[pcooney10]

@vitto-moz are you using create-react-native-app? If so, you are using expo (and would need to eject to use this lib).

[vitto-moz]

no, I don't
react-native run-android (for example)

[pcooney10]

@vitto-moz Ok. From what I've read, react-native link doesn't always work as expected, so I would maybe use that as your basis when trying to debug your issue. A lot of repos have instructions on how to link manually, so you may need to look through the source and see if all of the dependencies are getting added to your app's build.gradle and AndroidManifest.xml files.

[DylanVann]

A non-ejected app created using create-react-native-app uses expo.

react-native init myproject will create a plain React Native project.

[ghost]

@vitto-moz i also had the same issue today. my project was build using react-native init. I agree with @pcooney10 the react-native link didn't work as expected.

This is what i did to fix:
I created a new project and only added react-native-fast-image and successfully linked it using react-native link and then copied all the changes related to react-native-fast-image(MainActivity, ...) in my former project and it worked. I hope this helps.

[peteroid]

Seems the react-native link react-native-fast-image missed the step 2 described here https://facebook.github.io/react-native/docs/linking-libraries-ios.html. It worked after doing the step 2 manually.

Basically, I just added the libFastImage.a to the Linked Libraries section in the Build Phases.

[MacKentoch]

@peteroid As I'm using pod on my iOS project, I guess I have to link manually too.

Did you add FLAnimatedImage and SDWebimage too?

[MacKentoch]

I fixed my issue (no need for linking FLAnimatedImage and SDWebimage) that was linked to combination of pod + xcode 9 + automatic link with react-native link

I gave more details here

[DylanVann]

Manual linking instructions have been added here: https://github.com/DylanVann/react-native-fast-image/blob/master/docs/installation-manual.md

CocoaPods is also now supported.

[lucidtheory]

it looks like react-native-link adds a line to the pod file if you use cocoa pods, so just run pod install in ios folder

[Wbqqqq]

@peteroid thanks , I'm ok with your method!~

[reubert22]

Manual linking worked!