react-native-image-picker is undefined

Question

I have installed the package react-native-image picker:

npm i react-native-image-picker --save

And I have also linked it to my project:

react-native link react-native-image-picker

And when I try to import the module and use it:

import ImagePicker from 'react-native-image-picker';

 ImagePicker.launchImageLibrary(options, (response) => {
     // code here
   }

I receive this following error:

typeError: Cannot read property 'launchImageLibrary' of undefined

What went wrong here?

Answer 1

You should carefully check the newest documentation of this npm package as it was migrated to newer version. The old 2.xx version is deprecated, as written in the GitHub page of the package, thus names of key modules might have changed...

Answer 2

For 3.x version, you can directly import the function like

import {launchImageLibrary} from 'react-native-image-picker';

In an Expo project, I still got the same error, like this issue (since lauchImageLibrary comes from NativeModules.ImagePickerManager ). But it works fine in the project initialized with React Native CLI.

Answer 3

Below is the solution for it,

import {launchImageLibrary} from 'react-native-image-picker';

const changePhoto = () => {
    const options = {
      noData: true,
    };
    launchImageLibrary(options, (response) => {
      console.log(response);
    });
  };


<TouchableOpacity onPress={changePhoto}>
     <Text>Change Photo</Text>
</TouchableOpacity>

Answer 4

For version 3.x, let run npx pod-install then get the function by that way import { launchImageLibrary } from 'react-native-image-picker';

Answer 5

At the place of

import ImagePicker from 'react-native-image-picker';

replace with

var ImagePicker = require('react-native-image-picker');

and run the application again.