React-native-image-picker: image picker manager is null

Created on 5 Aug 2019  ·  39Comments  ·  Source: react-native-image-picker/react-native-image-picker

After installing react-native-image-picker according to this documentation the emulator is displaying this-

 react-native-image-picker: NativeModule.ImagePickerManager is null. To fix this issue try these steps:
ΓÇó Run `react-native link react-native-image-picker` in the project root.
ΓÇó Rebuild and re-run the app.
ΓÇó If you are using CocoaPods on iOS, run `pod install` in the `ios` directory and then rebuild and re-run the app. You may also need to re-open Xcode to get the new pods.
ΓÇó Check that the library was linked correctly when you used the link command by running through the manual installation instructions in the README.
* If you are getting this error while unit testing you need to mock the native module. Follow the guide in the README.
If none of these fix the issue, please open an issue on the Github repository: https://github.com/react-native-community/react-native-image-picker

And to follow the above instruction, I try to rebuild the app but after installing the image picker app is not building. Command prompt is giving this

> Task :app:processDebugManifest FAILED
E:\imageTest\android\app\src\debug\AndroidManifest.xml:22:18-91 Error:
        Attribute application@appComponentFactory value=(android.support.v4.app.CoreComponentFactory) from [com.android.support:support-compat:28.0.0] AndroidManifest.xml:22:18-91
        is also present at [androidx.core:core:1.0.0] AndroidManifest.xml:22:18-86 value=(androidx.core.app.CoreComponentFactory).
        Suggestion: add 'tools:replace="android:appComponentFactory"' to <application> element at AndroidManifest.xml:7:5-117 to override.

See http://g.co/androidstudio/manifest-merger for more information about the manifest merger.


FAILURE: Build failed with an exception.

* What went wrong:
Execution failed for task ':app:processDebugManifest'.
> Manifest merger failed : Attribute application@appComponentFactory value=(android.support.v4.app.CoreComponentFactory) from [com.android.support:support-compat:28.0.0] AndroidManifest.xml:22:18-91
        is also present at [androidx.core:core:1.0.0] AndroidManifest.xml:22:18-86 value=(androidx.core.app.CoreComponentFactory).
        Suggestion: add 'tools:replace="android:appComponentFactory"' to <application> element at AndroidManifest.xml:7:5-117 to override.

* Try:
Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output. Run with --scan to get full insights.

* Get more help at https://help.gradle.org

BUILD FAILED in 2m 3s
22 actionable tasks: 1 executed, 21 up-to-date
error Could not install the app on the device, read the error above for details.
Make sure you have an Android emulator running or a device connected and have
set up your Android development environment:
https://facebook.github.io/react-native/docs/getting-started.html
error Command failed: gradlew.bat app:installDebug. Run CLI with --verbose flag for more details.

And this is my AndroidManifest.xml file

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
  package="com.test">

    <uses-permission android:name="android.permission.INTERNET" />
    <uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW"/>

    <uses-permission android:name="android.permission.CAMERA" />
    <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>

    <application
      android:name=".MainApplication"
      android:label="@string/app_name"
      android:icon="@mipmap/ic_launcher"
      android:roundIcon="@mipmap/ic_launcher_round"
      android:allowBackup="false"
      android:theme="@style/AppTheme">
      <activity
        android:name=".MainActivity"
        android:label="@string/app_name"
        android:configChanges="keyboard|keyboardHidden|orientation|screenSize"
        android:windowSoftInputMode="adjustResize">
        <intent-filter>
            <action android:name="android.intent.action.MAIN" />
            <category android:name="android.intent.category.LAUNCHER" />
        </intent-filter>
      </activity>
      <activity android:name="com.facebook.react.devsupport.DevSettingsActivity" />
    </application>

</manifest>

Most helpful comment

I also have the same problem while using expo I have tried running react-native link react-native-image-picker did not work for me. This is what worked for me.

  1. Unistall the latest version
    npm uninstall react-native-image-picker
  2. Installed version 0.28.0
    npm install [email protected] --save
    react-native link react-native-image-picker

All 39 comments

info
React Native Environment Info:
System:
OS: Windows 10
CPU: (4) x64 Intel(R) Pentium(R) CPU G4560 @ 3.50GHz
Memory: 538.82 MB / 3.91 GB
Binaries:
Yarn: 1.16.0 - C:\Program Files (x86)\Yarn\bin\yarn.CMD
npm: 5.6.0 - C:\Program Files\nodejs\npm.CMD
IDEs:
Android Studio: Version 3.4.0.0 AI-183.6156.11.34.5692245

I am also getting the top message "react-native-image-picker: Native Module.ImagePickerManager is null."
I manually installed the xcodeproject file to my libraries.
And did all the previous steps but still can't get it to work.

This NPM package had lots of problems though I have tried using it. I encountered
react-native-image-picker: NativeModule.ImagePickerManager is null. To fix this issue try these steps:
ΓÇó Run react-native link react-native-image-picker in the project root.
most of the time.

Having same issue using expo.

Thank you for your email, I want to use this NPM module on my android as
well as ios application but i encounter an error, Which is frequent and
iterative.
So, It blocks me to debug my application on my device as well as Emmulator.
So, what are the viable solution for me so that, I can implement it on my
project. Hope your response will cover all of my concerns.

Thank you!

On Sat, Aug 10, 2019 at 5:21 AM Oliver Kucharzewski <
[email protected]> wrote:

Having same issue using expo.


You are receiving this because you commented.
Reply to this email directly, view it on GitHub
https://github.com/react-native-community/react-native-image-picker/issues/1146?email_source=notifications&email_token=AD5A5DEVBXTOQ6CZSODG7GDQDX5ORA5CNFSM4IJG42I2YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOD4AAPWQ#issuecomment-520095706,
or mute the thread
https://github.com/notifications/unsubscribe-auth/AD5A5DAUJSU4JQ6FZR5BGJ3QDX5ORANCNFSM4IJG42IQ
.

I fixed it by running 'pod install', for RN >= 60

I have the same problem when running the application on Android (react-native-image-picker: Native Module.ImagePickerManager is null).
I have all versions of the manual.
I have tried to link react-native-image-picker manually and automatically.

Is there any solution?

I also have the same problem while using expo I have tried running react-native link react-native-image-picker did not work for me. This is what worked for me.

  1. Unistall the latest version
    npm uninstall react-native-image-picker
  2. Installed version 0.28.0
    npm install [email protected] --save
    react-native link react-native-image-picker

Thanks React-Native-Community/React-Native-Image-Picker, i had solved this
problem already i am not using expo for react native development.

On Wed, Oct 2, 2019 at 2:51 PM Larry karani notifications@github.com
wrote:

I also have the same problem while using expo I have tried running react-native
link react-native-image-picker did not work for me. This is what worked
for me.

  1. Unistall the latest version
    npm uninstall react-native-image-picker
  2. Installed version 0.28.0
    npm install [email protected] --save
    react-native link react-native-image-picker


You are receiving this because you commented.
Reply to this email directly, view it on GitHub
https://github.com/react-native-community/react-native-image-picker/issues/1146?email_source=notifications&email_token=AD5A5DGXOIRPWIIGYHPC2WTQMRP7TA5CNFSM4IJG42I2YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOEAECOSA#issuecomment-537405256,
or mute the thread
https://github.com/notifications/unsubscribe-auth/AD5A5DBWVPNTT527W33GDBLQMRP7TANCNFSM4IJG42IQ
.

@subashtimalsina how did you solve the issue? I am getting the same error

Dont worry It seems the Linking didnt work. I manually went through the manual linking to solve the issue.

I am done with this issue.

On Mon, Oct 7, 2019, 1:09 PM fahadhaq notifications@github.com wrote:

Dont worry It seems the Linking didnt work. I manually went through the
manual linking to solve the issue.


You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
https://github.com/react-native-community/react-native-image-picker/issues/1146?email_source=notifications&email_token=AD5A5DEYHUISFLCCYR2YQQTQNLPZ5A5CNFSM4IJG42I2YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOEAPIRNQ#issuecomment-538871990,
or mute the thread
https://github.com/notifications/unsubscribe-auth/AD5A5DCPJE6H6CPTU5JPR5TQNLPZ5ANCNFSM4IJG42IQ
.

I also have the same problem
. This is what worked for me.

Unistall the latest version
npm uninstall react-native-image-picker
Installed version 0.28.0
npm install [email protected] --save
react-native link react-native-image-picker

This solution really solve my problem .

follow this steps.

Unistall the latest version
npm uninstall react-native-image-picker
Installed version 0.28.0
npm install [email protected] --save
react-native link react-native-image-picker

is this issue still happened?

is this issue still happened?

YES!

still happening with latest release

What can I do? What can I do?

Checking in. Still happening as of mid December 2019

Still happening

Can any of you provide a reproducible example?
My guess is you're missing a step in the installation.

Can any of you provide a reproducible example?
My guess is you're missing a step in the installation.

It's working for my while developing, but i'm getting this error message when i try to run tests

I'm using 1.1.x for react-native-image picker, and react-native 59.9. I was able to get around this error in tests by mocking the native module. In my Jest setup script, I included this, and the tests passed:

jest.mock('react-native-image-picker', () => ({
}));

I am still facing issue.

Try to clean build once @KingJics

I have the exact issue and I use expo. What's the fix?

I am still experiencing this issue and I tried downgrading the version of the dependency as well. It works normally in the iOS simulator when I run yarn ios, but it errors in the Expo Client app on my iOS device.

Does this error also occur during app deployment?

same issue guys...any solution please?

i have some problem; react native version 0.62

then i use npx react-native init AwesomeTSProject --template react-native-template-typescript to init a new Project

then copy all files(except android and ios) to to new project.

it work.

i have some problem; react native version 0.62

then i use npx react-native init AwesomeTSProject --template react-native-template-typescript to init a new Project

then copy all files(except android and ios) to to new project.

it work.

Yes, it is feasible. But why?

Please, can anyone help me out with this error?
facing this issue from so long

any solution for this problem?

"react-native": "0.62.2"
"react-native-image-picker": "^2.3.3

Today I face the same problem when I integrate this package. But I try in other way! My RN version is 0.61.5, this package version is 2.3.3. I have solved this problem!
follow this step below :

  1. yarn add react-native-image-picker

2.manually add pod 'react-native-image-picker', :path => '../node_modules/react-native-image-picker' to 'target 'xxxApp' do'

  1. pod install

4.if react-native link react-native-image-picker, pod 'react-native-image-picker', :path => '../node_modules/react-native-image-picker' locate in 'target 'xxxApp-tvOSTests' do' ,this result in error above.

Snip20200812_2

It is because if we use expo for react native image picker

If you are using expo use import expo image picker
If you are using react native use import react native image picker

@bimbox-open thank you for your help, but pod install leads to another error, I think it's applicable only in macOS, I'm using ubuntu at the moment
I did gem install pod before that and when running pod install it shows some progress and installs a lot of stuff but it shows this error:

[!] /bin/bash -c 
set -e
#!/bin/bash
# Copyright (c) Facebook, Inc. and its affiliates.
#
# This source code is licensed under the MIT license found in the
# LICENSE file in the root directory of this source tree.

set -e

PLATFORM_NAME="${PLATFORM_NAME:-iphoneos}"
CURRENT_ARCH="${CURRENT_ARCH}"

if [ -z "$CURRENT_ARCH" ] || [ "$CURRENT_ARCH" == "undefined_arch" ]; then
    # Xcode 10 beta sets CURRENT_ARCH to "undefined_arch", this leads to incorrect linker arg.
    # it's better to rely on platform name as fallback because architecture differs between simulator and device

    if [[ "$PLATFORM_NAME" == *"simulator"* ]]; then
        CURRENT_ARCH="x86_64"
    else
        CURRENT_ARCH="armv7"
    fi
fi

export CC="$(xcrun -find -sdk $PLATFORM_NAME cc) -arch $CURRENT_ARCH -isysroot $(xcrun -sdk $PLATFORM_NAME --show-sdk-path)"
export CXX="$CC"

# Remove automake symlink if it exists
if [ -h "test-driver" ]; then
    rm test-driver
fi

./configure --host arm-apple-darwin

# Fix build for tvOS
cat << EOF >> src/config.h
/* Add in so we have Apple Target Conditionals */
#ifdef __APPLE__
#include <TargetConditionals.h>
#include <Availability.h>
#endif
/* Special configuration for AppleTVOS */
#if TARGET_OS_TV
#undef HAVE_SYSCALL_H
#undef HAVE_SYS_SYSCALL_H
#undef OS_MACOSX
#endif
/* Special configuration for ucontext */
#undef HAVE_UCONTEXT_H
#undef PC_FROM_UCONTEXT
#if defined(__x86_64__)
#define PC_FROM_UCONTEXT uc_mcontext->__ss.__rip
#elif defined(__i386__)
#define PC_FROM_UCONTEXT uc_mcontext->__ss.__eip
#endif
EOF

# Prepare exported header include
EXPORTED_INCLUDE_DIR="exported/glog"
mkdir -p exported/glog
cp -f src/glog/log_severity.h "$EXPORTED_INCLUDE_DIR/"
cp -f src/glog/logging.h "$EXPORTED_INCLUDE_DIR/"
cp -f src/glog/raw_logging.h "$EXPORTED_INCLUDE_DIR/"
cp -f src/glog/stl_logging.h "$EXPORTED_INCLUDE_DIR/"
cp -f src/glog/vlog_is_on.h "$EXPORTED_INCLUDE_DIR/"

checking for a BSD-compatible install... /usr/bin/install -c
checking whether build environment is sane... yes
checking for arm-apple-darwin-strip... no
checking for strip... strip
checking for a thread-safe mkdir -p... /bin/mkdir -p
checking for gawk... gawk
checking whether make sets $(MAKE)... yes
checking whether make supports nested variables... yes
checking for arm-apple-darwin-gcc...  -arch armv7 -isysroot 
checking whether the C compiler works... no
/bin/bash: line 24: xcrun: command not found
/bin/bash: line 24: xcrun: command not found
/home/khalid/Library/Caches/CocoaPods/Pods/Release/Flipper-Glog/0.3.6-1dfd6/missing: Unknown `--is-lightweight' option
Try `/home/khalid/Library/Caches/CocoaPods/Pods/Release/Flipper-Glog/0.3.6-1dfd6/missing --help' for more information
configure: WARNING: 'missing' script is too old or missing
configure: error: in `/home/khalid/Library/Caches/CocoaPods/Pods/Release/Flipper-Glog/0.3.6-1dfd6':
configure: error: C compiler cannot create executables
See `config.log' for more details

by the way thank you man, I think like @nikhataara said because we use expo we should use something expo for image picking

I fixed it finally
3-unlinked the package
2-uninstalled the package
3-install again
4- (the most important ) is you need permission obviously , so I added these to AndroidManifest.xml in android/app/src/main :

For those using Jest, you will need to mock this library. To do so, simply create a new File called _'react-native-image-picker.js'_ under __test_ folder. And add following lines of code inside it:

import {NativeModules} from 'react-native';

// Mock the ImagePickerManager native module to allow us to unit test the JavaScript code
NativeModules.ImagePickerManager = {
  showImagePicker: jest.fn(),
  launchCamera: jest.fn(),
  launchImageLibrary: jest.fn(),
};

// Reset the mocks before each test
global.beforeEach(() => {
  jest.resetAllMocks();
});

This worked for me. Thanks

I also have the same problem while using expo I have tried running react-native link react-native-image-picker did not work for me. This is what worked for me.

1. Unistall the latest version
   `npm uninstall react-native-image-picker`

2. Installed version 0.28.0
   `npm install [email protected] --save`
   `react-native link react-native-image-picker`

I had the same problem after an upgrade from RN0.059 to 0.63 and version 0.28 of the lib did work for me on iOS but on android as the version is not on androidX it failed. Installing version
1.1.0 of RN-image-picker worked on both ios and android. So thank you very much for giving the idea of downgrading the lib.

In conclusion : yarn add [email protected] resolved it for me

I hope the issue is solved, if not create new issue with details I am happy to fix it. This thread is long and tries to mingle lot of issues together.

Version 2.x.x is not longer supported, please upgrade to 3.x.x

Was this page helpful?
0 / 5 - 0 ratings

Related issues

zscaiosi picture zscaiosi  ·  81Comments

winkelsdorf picture winkelsdorf  ·  26Comments

jefelewis picture jefelewis  ·  27Comments

ferminmoli picture ferminmoli  ·  26Comments

woodpav picture woodpav  ·  26Comments