react-native-image-picker is undefined

user_12647804 0
Viewed 2412

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?

react-native javascript
5 Answers

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

user_100715760

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>
user_56214780

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.

user_152578140

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.

user_54591680

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

user_85851140
Related