React-native-image-crop-picker: undefined is not an object (evaluating '_reactNativeImageCropPicker2.default.openPicker')

[Jaafar-abusair]

Version

Tell us which versions you are using:

• react-native-image-crop-picker v0.10.2
• react-native v0.35.0

Platform

Tell us to which platform this issue is related

• Android

Expected behaviour

On calling
ImagePicker.openPicker({
width: 300,
height: 400,
cropping: true
}).then(image => {
console.log(image);
});

I expect to open the camera roll and pick pictures

Actual behaviour

undefined is not an object (evaluating '_reactNativeImageCropPicker2.default.openPicker')

Steps to reproduce

1. click on button call this function
   ImagePicker.openPicker({
   width: 300,
   height: 400,
   cropping: true
   }).then(image => {
   console.log(image);
   });

Attachments

// stacktrace or any other useful debug info

[sundou]

I meet it too

[ivpusic]

this means your project is not linked with react-native-image-crop-picker. Follow these steps https://github.com/ivpusic/react-native-image-crop-picker#install

[Jaafar-abusair]

No it's linked I did react-native link, but it didn't work, kindly reopen the issue

[ivpusic]

Could you please open android studio, and check you build.gradle file if there is https://github.com/ivpusic/react-native-image-crop-picker/blob/master/example/android/app/build.gradle#L130. Also please check if there is https://github.com/ivpusic/react-native-image-crop-picker/blob/master/example/android/app/src/main/java/com/example/MainApplication.java#L28. And please clean and build application again.

[Jaafar-abusair]

I can't find any of these

[ivpusic]

so that means link didn't work for you. You can try running unlink and then linking again.

[Jaafar-abusair]

Still the same problem, how to add them manually for Android?

[ivpusic]

https://github.com/ivpusic/react-native-image-crop-picker/blob/79d3dab7e5dd377551701a74203deb5667bdfde2/README.md#android-1

[Jaafar-abusair]

this good, but now im getting this on openPicker

W/ReactNativeJS(15493): Possible Unhandled Promise Rejection (id: 0):

W/ReactNativeJS(15493): Can only use lower 16 bits for requestCode

[Jaafar-abusair]

No wait I was using import com.reactnative.ivpusic.imagepicker.PickerPackage;
on MainApplication.js let me try import com.reactnative.picker.PickerPackage; first

[Jaafar-abusair]

No it should be import com.reactnative.ivpusic.imagepicker.PickerPackage; you need to update that tutorial, still have this error
W/ReactNativeJS(15493): Possible Unhandled Promise Rejection (id: 0):

W/ReactNativeJS(15493): Can only use lower 16 bits for requestCode

any idea?

[ivpusic]

readme file is very old version, I took it from git history. Could you try chaning line https://github.com/ivpusic/react-native-image-crop-picker/blob/master/android/src/main/java/com/reactnative/ivpusic/imagepicker/PickerModule.java#L47 and the one bellow to some smaller numbers. Let's say 14320 and 14321?

[Jaafar-abusair]

I solved it by changing
private static final int IMAGE_PICKER_REQUEST = to 61111;
private static final int CAMERA_PICKER_REQUEST = to 61112;

Can you update the code in class PickerModule, startActivityForResult() in FragmentActivity requires the requestCode to be of 16 bits, meaning the range is from 0 to 65535.

[ivpusic]

great. Could you create PR with this fix? Thanks

[Jaafar-abusair]

How to crop?
ImagePicker.openPicker({
width: 300,
height: 400,
multiple: true,
cropping: true
}).then(images => {
console.log(images);
});

I can't see the option

[ivpusic]

when you say cropping: true after user selects image, cropping window will automatically open

[Jaafar-abusair]

cropping not working with multi, make sense, thanks for helping

[Jaafar-abusair]

one more question, is there any capability to reduce the image size, like when user select a 2MB image, converting it to 100k, like wsup and other apps do

[ivpusic]

currently there is no public api for this.

[Jaafar-abusair]

Well, I have created mine, I might send you a PR

[tanmynguyen]

Thanks bro @Jaafar-abusair

[blainemuri]

Issue
I'm still getting this issue where it's not linking correctly.
Here is the error:

I ran react-native unlink and then again react-native link and it's giving the following:

Versions
React-Native: 0.47.2
Gradle: 2.2.3

Platform
This is only occurring on Android

Can we please reopen this issue?

[Jaafar-abusair]

Do the link manually

On Nov 2, 2017 10:40 PM, "Blaine Muri" [e-mail] wrote:

Issue
I'm still getting this issue where it's not linking correctly.
I ran react-native unlink and then again react-native link and it's
giving the following:
[image: screen shot 2017-11-02 at 1 37 02 pm]
https://user-images.githubusercontent.com/5514877/32349029-fb6e7158-bfd2-11e7-983e-b3c868f5a73f.png

Versions
React-Native: 0.47.2
Gradle: 2.2.3

Platform
This is only occurring on Android

Can we please reopen this issue?

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
https://github.com/ivpusic/react-native-image-crop-picker/issues/132#issuecomment-341551245,
or mute the thread
https://github.com/notifications/unsubscribe-auth/ABc7-v30TYrWxG1Hq-lfBZmqiZxFbvkDks5syiihgaJpZM4KtRXf
.

[blainemuri]

The old Readme for manual linking is outdated and doesn't work with the more recent React-Native

[blainemuri]

I solved the issue. Based on the old Readme here:
https://github.com/ivpusic/react-native-image-crop-picker/blob/79d3dab7e5dd377551701a74203deb5667bdfde2/README.md#android-1

In the MainApplication.java
it asks to import the package as follows: import com.reactnative.picker.PickerPackage;

It should instead be imported as import com.reactnative.ivpusic.imagepicker.PickerPackage;

This should be updated as an addition to the Readme for manual linking in the case that linking doesn't work (which seems to be a common case)

[Paul-Lategan]

If anyone is getting this error on iOS, here's what fixed it for me:

• I was on React Native version 49.0.3, using Cocoapods
• I upgraded to React Native version 50 (the process below did not work until I upgraded React Native)

Uninstall

• comment out these two lines in your Podfile:
  pod 'RSKImageCropper'
  pod 'QBImagePickerController'
• run "pod init"
• react-native unlink react-native-image-crop-picker
• npm uninstall react-native-image-crop-picker --save

Reinstall

• npm install --save react-native-image-crop-picker
• react-native link react-native-image-crop-picker
• uncomment these two lines in your Podfile:
  pod 'RSKImageCropper'
  pod 'QBImagePickerController'
• run "pod init"

[profiVideos]

I had the same issue running on a build based on react-native-navigation. Since the auto index did not correctly add the ImagePackage, I had to manually add it the MainApplication.java. Here is the relevant portion of the file;

public class MainApplication extends NavigationApplication { <- init script was not recognizing this ...

@Override
public boolean isDebug() {
// Make sure you are using BuildConfig from your own application
return BuildConfig.DEBUG;
}

protected List getPackages() {
// Add additional packages you require here
// No need to add RnnPackage and MainReactPackage
return Arrays.asList(
new VectorIconsPackage(),
new PickerPackage() <- Manually added this here.
);
}

@Override
...

After adding this line, it worked like a charm after the next recompile.
Cheers, Markus

[ychen072]

I fixed... but just to mention, I followed the standard install from documentation. and this line
https://github.com/ivpusic/react-native-image-crop-picker/blob/master/example/android/app/build.gradle#L130
was not added by the installation...

[borch84]

Hello, I am having the same issue, undefined is not an object evaluating _reactNativeImageCropPicker2.default.openPicker
I am working only with Expo, and not doing deployments to IOS or Android.
I already tried unlink and link react-image-image-crop-picker with no luck

[adamnator92]

i just fix my issues with manual link, the react native link command sometimes didn't work, manual link is highly recommended.

[ghostac4]

Tried manual linking still not working. Please see into this issue.

[Jaafar-abusair]

@ghostac4, can you post the code from your manual linking? also have you close your packager and run the build again, try with "gradlew clean" command, on Android folder first

[NazifaNajish01]

As per profiVideos reply,
Adding new PickerPackage() Worked for me... (Y)

protected List getPackages() {
// Add additional packages you require here
// No need to add RnnPackage and MainReactPackage
return Arrays.asList(
new VectorIconsPackage(),
new PickerPackage() <- Manually added this here.
);
}

[SteFF1997]

manual installation instruction is not complete
1)add implementation project(':react-native-image-crop-picker') to build.gradle
2)add include ':react-native-image-crop-picker'
project(':react-native-image-crop-picker').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-image-crop-picker/android') to setting.gradle
3)add import com.reactnative.ivpusic.imagepicker.PickerPackage and new PickerPackage() to List of ReactPackage
that's all, hope this will solve this issues

[cinnabarhorse]

also encountered this error and had basically given up hope on using this library, but since there aren't any other great alternatives I persisted. I don't use cocoapods, but I installed according to the readme and was getting the "Cannot read property" error when calling the openPicker function. Turns out that calling "rm -rf node_modules/" and then "npm install" was the solution. Hope this helps someone.

[co-de]

manual installation instruction is not complete
1)add implementation project(':react-native-image-crop-picker') to build.gradle
2)add include ':react-native-image-crop-picker'
project(':react-native-image-crop-picker').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-image-crop-picker/android') to setting.gradle
3)add import com.reactnative.ivpusic.imagepicker.PickerPackage and new PickerPackage() to List of ReactPackage
that's all, hope this will solve this issues

This is all done for me but still not working.

[co-de]

also encountered this error and had basically given up hope on using this library, but since there aren't any other great alternatives I persisted. I don't use cocoapods, but I installed according to the readme and was getting the "Cannot read property" error when calling the openPicker function. Turns out that calling "rm -rf node_modules/" and then "npm install" was the solution. Hope this helps someone.

Nope

[co-de]

As per profiVideos reply,
Adding new PickerPackage() Worked for me... (Y)

protected List getPackages() {
// Add additional packages you require here
// No need to add RnnPackage and MainReactPackage
return Arrays.asList(
new VectorIconsPackage(),
new PickerPackage() <- Manually added this here.
);
}

I already have this in place but not working

[gharShaddi]

having the same issue as listed here working on react-native 0.61.5 with react-native-image-crop-picker 0.28

[fabellonnoe]

I got rid of this by adding react-native-image-crop-picker folder inside node_modules
and run
cd ios
pod install