React-native-push-notification: "Native module cannot be null"

[hedegren]

I just upgrade React-native from 0.28 to 0.30, and get this error:
"Native module cannot be null"

I tried reinstall npm and remove all build files.

What can I do?

[tomazahlin]

I have the same problem today on iOS.

I think this has nothing to do with this repository, might be better to submit this issue / ask for help in react-native repository.

On the other hand, if this repository is using "require" instead of "import", the issue might be here. I did not manage to solve this problem today.

[fmnxl]

I think you need to link it first:
https://facebook.github.io/react-native/docs/pushnotificationios.html

[tomazahlin]

For example, I had it linked, but I still got this error. Today my coworker updated react-native to 0.31-rc. He said it solved the issue, but I haven't tried myself yet.

[charlesLin]

I run it on real iPad device successfully, but got the same error on iOS emulator.

info:
react-native 0.31.0

[zo-chu]

Any solutions on that? i have this error on emulator and on iphone it stopped loading the bundle ( might smth else cause this issue with bundle but it happened at the same time = ))
react-native 0.31.0

[bkhanal]

I am getting the same error, has this been fixed. I am on RN 0.32

[npomfret]

Have you checked in your MainApplicaiton that its been linked correctly? I think this is a common cause of this issue

[CharlieIGG]

Same issue on RN 0.32, in iOS, please if anyone has been able to fix this let us know.
BTW – It all works fine on Android, the problem is only in iOS for me... I have linked libraries as per the official PushNotificationIOS docs. Any clues @charlesLin @tomazahlin @hedegren ??

[thbwd]

Rebuilding and running the app from Xcode did the trick for me.

[antoniopuero]

You do really need to go through manual procedure to get it work https://facebook.github.io/react-native/docs/linking-libraries-ios.html#manual-linking if you don't have a developer account in apple center

[npomfret]

No, just follow the instructions in the readme.

[tanapaydin]

I'm having the same issue. My versions are as follows:

• "react-native": "0.39.2",
• "react-native-push-notification": "^2.2.1"
  I've removed /node_modules /android /ios folders. Then ran the following commands in that order:
• npm install
• react-native upgrade
• react-native link
  It seems the culprit is the required/import problem.
  If you change the following line from:
• const NativeEventEmitter = require('NativeEventEmitter');
  to this:
• import NativeEventEmitter from 'NativeEventEmitter';
  That did the trick. However, I shouldn't be changing the node_modules files. This should be fixed.

[liftyourgame]

Where do you change the require to import? What file(s)?

[quantuminformation]

Just done a fresh RN latest install and get the same error.

[alexeyMohnatkin]

Same error on ios after update to 0.44.


I reinstall node_modules, clear all caches, nothing helps.

[zalesky]

following the instructions on RA site about linking helped for me https://facebook.github.io/react-native/docs/linking-libraries-ios.html#manual-linking

[jamesone]

What I did to fix this was:

1. Close all open react-native packagers
2. Clean the build
3. Run the app

Simply running the app via the command line didn't work for me.

[malangaveuday]

Same error with react-native '^0.52.2'

I did the react-native upgrade and this issue occurs.

I did manual linking also but not able to resolve.

[e2o]

@malangaveuday, have you followed the instructions outlined here: https://facebook.github.io/react-native/docs/pushnotificationios.html?

[ghost]

I have linked it manually for 8 times today already and it is still not working... Any help would be appreciated. I can see below that it is not recognising react-native-push-notification but it is recognising a different on (which I don't want to use but just added as a test)

rnpm-install info Android module react-native-notifications is already linked
rnpm-install info iOS module react-native-notifications is already linked
rnpm-install info Android module react-native-push-notification is already linked
rnpm-install info Linking assets to ios project
rnpm-install info Linking assets to android project
rnpm-install info Assets have been successfully linked to your project

[mproctor340]

@malangaveuday did you manage to resolve this issue? I am having the exact same with main.jsbundle

[8of]

We use CocoaPods in our project and simple linking doesn't work.
react-native version: 0.54.3

Here is a how-to for CocoaPods users:

• Add PushNotification subspec to Podfile:

pod 'React', :path => '../node_modules/react-native', :subspecs => [
    'Core',
    ...
    'RCTPushNotification',
    ...
  ]

• Execute pod update Terminal when you in ios folder
• Open *.xcworkspace workspace file in XCode (for our 0.54.3 react-native version the only working XCode version is 9.2)
• Choose the first tab on the left pane
• There are two top-most projects in your left pane now - Pods and your project, expand your project
• Open Libraries folder
• Open node_modules folder in Finder and find RCTPushNotification.xcodeproj file
• Drag RCTPushNotification.xcodeproj file from Finder to Libraries folder in XCode
• Choose your target on the right in Xcode -> General tab
• Scroll to Linked Frameworks and Libraries
• Tap on plus sign
• Enter libRCTPushNotification in search input field (not tvOS)
• If it's found - add it to the project
• Try to build you project via react-native run-ios and then run it

I hope it will work for you, mates 🤗

[sarath-rp]

I have a native app and I bundled my react-native app as in this documentation. I am also getting the same error what I will do?

[Lie8466]

Followed the instructions https://facebook.github.io/react-native/docs/pushnotificationios.html still got Native Module cannot be null

Then found that I linked a wrong file. Correct it and delete build and node_modules, run npm install and react-native run-ios, works!

[lsirdevan]

Alright this took me forever to figure out. Shoutout to @8of his solution worked great for me. I started with an expo app using create-react-native-app but had to detach to ExpoKit for _reasons_.

@8of 's solution works great for detached expo applications. After adding

pod 'React', :path => '../node_modules/react-native', :subspecs => [
    'Core',
    ...
    'RCTPushNotification',
    ...
  ]

To my podfile, it worked flawlessly. I was able to follow the remaining steps from the FB docs here : https://facebook.github.io/react-native/docs/pushnotificationios.html#content

Hope this helps someone! It took me way too long to figure it out.

[sbichenko]

I had the same problem with create-react-native-app. I had to delete the import * as StatusBar from "react-native"; line to fix it.

[Radilx]

This was weird... I eventually just had to link manually. The lesson? Don't trust react-native link!

[anilkumar1505]

I have React Native project and Native app combined. And I have version of react native 0.57.0
and React version "react": "16.5.0", screen shoot attached.

any one help regarding on that.

[duonghan]

how to solve the problem above?

[rb162215]

I had same problem and issue is fixed by running POD update command then expo start and reinstall build.

[shlok97]

try running react-native link.
worked for me

[brenwell]

Just a note for anyone as dumb as me. I have multiple RN projects and I had this problem because I had metro running for the wrong project

[umbrella-kirill-karpov]

WRONG WAY (Old message to keep the history)

To solve RN 0.60: - add `pod 'React-RCTPushNotification', :path => '../node_modules/react-native/Libraries/PushNotificationIOS'` to `ios/Podfile` - execute `pod install` - execute `react-native run-ios`

Check the next answers.

[cumen]

remove react-native-push-notification in node_modules

run npm install [email protected]

[ziaulrehman40]

Thanks @cumen This happened to me after an upgrade from 3.1.3 to 3.1.8. Strange thing is changelog is not yet there in https://github.com/zo0r/react-native-push-notification/blob/master/CHANGELOG.md

[GabeConsalter]

To solve RN 0.60:

• add pod 'React-RCTPushNotification', :path => '../node_modules/react-native/Libraries/PushNotificationIOS' to ios/Podfile
• execute pod install
• execute react-native run-ios

After added React-RCTPushNotification to my ios/Podfile, I'm having a duplication problem when building:
```
duplicate symbol _RCTRemoteNotificationReceived in:
.../Xcode/DerivedData/my-project-xcode-folder/Build/Products/Debug-iphoneos/RNCPushNotificationIOS/libRNCPushNotificationIOS.a(RNCPushNotificationIOS.o)
.../Xcode/DerivedData/my-project-xcode-folder/Build/Products/Debug-iphoneos/React-RCTPushNotification/libReact-RCTPushNotification.a(RCTPushNotificationManager.o)
ld: 1 duplicate symbol for architecture amd64

[thijs-qv]

I also had the duplication error when adding React-RCTPushNotification in Podfile, so I didn't add it.
Don't forget to update the import of the PushNotificationIOS module. This ended up solving the problem for me. PushNotificationIOS has been taken out of react-native core.

Change
import { PushNotificationIOS } from "react-native";
to
import PushNotificationIOS from "@react-native-community/push-notification-ios";

[Ovsdrak]

Solution FOUND!

Platform: iOS
Problem: Native module cannot be null
Error line: var PushNotification = require('react-native-push-notification');

SOLUTION

NOTES:
Do NOT use this docs:
https://facebook.github.io/react-native/docs/pushnotificationios

USE this ones:
https://github.com/zo0r/react-native-push-notification
https://github.com/react-native-community/react-native-push-notification-ios

Package.json

In your package.json consider this (ignore react native version):

"react-native": "0.59.9"
"react-native-push-notification": "^3.1.8",
"@react-native-community/push-notification-ios": "^1.0.2",

Run command: npm install

Podfile

Add this pod to your Podfile

pod 'RNCPushNotificationIOS', :path => '../node_modules/@react-native-community/push-notification-ios'

Run command in ios directory:
pod install

NOTES:
Remove this subspec in your Podfile:
'RCTPushNotification'

Xcode Project

PART 1:
Add
node_modules/@react-native-community/push-notification-ios/ios/PushNotificationIOS.xcodeproj

To Directory
_yourProject/Libraries/_

Add
libRNCPushNotificationIOS.a
To
_NameProject -> Targets -> NameProject -> Build Phases -> Link Binary With Libraries_

Screenshot*

PART 2: The reason of this part, is that the import done in AppDelegate.m works fine.

Drag And Drop this folder
yourProject/ios/Pods/Headers/Public/RNCPushNotificationIOS
To
_Build Settings -> Search Paths -> Header Search Paths_

Set non-recursive property

Screenshot

NOTES:
Remove RCTPushNotification.xcodeproj from _yourProject/Libraries_
Make sure libRTCPushNotification.a disappeared from _NameProject -> Targets -> NameProject -> Build Phases -> Link Binary With Libraries_

AppDelegate.m

Add this import to your AppDelegate.m file:

#import "RNCPushNotificationIOS.h"

Add this in the @implementation section.

...
// Required to register for notifications
- (void)application:(UIApplication *)application didRegisterUserNotificationSettings:(UIUserNotificationSettings *)notificationSettings
{
  [RNCPushNotificationIOS didRegisterUserNotificationSettings:notificationSettings];
}
// Required for the register event.
- (void)application:(UIApplication *)application didRegisterForRemoteNotificationsWithDeviceToken:(NSData *)deviceToken
{
  [RNCPushNotificationIOS didRegisterForRemoteNotificationsWithDeviceToken:deviceToken];
}
// Required for the notification event. You must call the completion handler after handling the remote notification.
- (void)application:(UIApplication *)application didReceiveRemoteNotification:(NSDictionary *)userInfo
fetchCompletionHandler:(void (^)(UIBackgroundFetchResult))completionHandler
{
  [RNCPushNotificationIOS didReceiveRemoteNotification:userInfo fetchCompletionHandler:completionHandler];
}
// Required for the registrationError event.
- (void)application:(UIApplication *)application didFailToRegisterForRemoteNotificationsWithError:(NSError *)error
{
  [RNCPushNotificationIOS didFailToRegisterForRemoteNotificationsWithError:error];
}
// Required for the localNotification event.
- (void)application:(UIApplication *)application didReceiveLocalNotification:(UILocalNotification *)notification
{
  [RNCPushNotificationIOS didReceiveLocalNotification:notification];
}

NOTES:

Remove

• #import <React/RCTPushNotificationManager.h>
• Every method using the RCTPushNotificationManager library, make sure you have only the above ones.

[sushrutha]

@Ovsdrak This solution works! Thank you!

[omererbil]

USE those libraries:
https://github.com/zo0r/react-native-push-notification
https://github.com/react-native-community/react-native-push-notification-ios

follow step by step,
everything will work
no need anything else
not foget to pod install

[kazuooooo]

@Ovsdrak kind answer perfect for me! thanks!

[kazuooooo]

This error also occured old import way.

import { PushNotificationIOS } from 'react-native

need to fix to this

import PushNotificationIOS from '@react-native-community/push-notification-ios'

[fkotsian]

Was able to figure this out thanks to the above 3 answers and everyone else on this thread 😄 .

If you're on RN ^0.59 and rn-push-notifications ^3.1.9:

react-native link @react-native-community/push-notification-ios

The 'missing native module' is the linked @community library. RPN 3.1.3 -> 3.1.9 updated to use the community library over the native one, but that step is missing from the Getting Started docs

🎉 😄 👍

[eramudeep]

Solution FOUND!

Platform: iOS
Problem: Native module cannot be null
Error line: var PushNotification = require('react-native-push-notification');

SOLUTION

NOTES:
Do NOT use this docs:
https://facebook.github.io/react-native/docs/pushnotificationios

USE this ones:
https://github.com/zo0r/react-native-push-notification
https://github.com/react-native-community/react-native-push-notification-ios

Package.json

In your package.json consider this (ignore react native version):

"react-native": "0.59.9"
"react-native-push-notification": "^3.1.8",
"@react-native-community/push-notification-ios": "^1.0.2",

Run command: npm install

Podfile

Add this pod to your Podfile

pod 'RNCPushNotificationIOS', :path => '../node_modules/@react-native-community/push-notification-ios'

Run command in ios directory:
pod install

NOTES:
Remove this subspec in your Podfile:
'RCTPushNotification'

Xcode Project

PART 1:
Add
node_modules/@react-native-community/push-notification-ios/ios/PushNotificationIOS.xcodeproj

To Directory
_yourProject/Libraries/_

Add
libRNCPushNotificationIOS.a
To
_NameProject -> Targets -> NameProject -> Build Phases -> Link Binary With Libraries_

Screenshot*

PART 2: The reason of this part, is that the import done in AppDelegate.m works fine.

Drag And Drop this folder
yourProject/ios/Pods/Headers/Public/RNCPushNotificationIOS
To
_Build Settings -> Search Paths -> Header Search Paths_

Set non-recursive property

Screenshot

NOTES:
Remove RCTPushNotification.xcodeproj from _yourProject/Libraries_
Make sure libRTCPushNotification.a disappeared from _NameProject -> Targets -> NameProject -> Build Phases -> Link Binary With Libraries_

AppDelegate.m

Add this import to your AppDelegate.m file:

#import "RNCPushNotificationIOS.h"

Add this in the @implementation section.

...
// Required to register for notifications
- (void)application:(UIApplication *)application didRegisterUserNotificationSettings:(UIUserNotificationSettings *)notificationSettings
{
  [RNCPushNotificationIOS didRegisterUserNotificationSettings:notificationSettings];
}
// Required for the register event.
- (void)application:(UIApplication *)application didRegisterForRemoteNotificationsWithDeviceToken:(NSData *)deviceToken
{
  [RNCPushNotificationIOS didRegisterForRemoteNotificationsWithDeviceToken:deviceToken];
}
// Required for the notification event. You must call the completion handler after handling the remote notification.
- (void)application:(UIApplication *)application didReceiveRemoteNotification:(NSDictionary *)userInfo
fetchCompletionHandler:(void (^)(UIBackgroundFetchResult))completionHandler
{
  [RNCPushNotificationIOS didReceiveRemoteNotification:userInfo fetchCompletionHandler:completionHandler];
}
// Required for the registrationError event.
- (void)application:(UIApplication *)application didFailToRegisterForRemoteNotificationsWithError:(NSError *)error
{
  [RNCPushNotificationIOS didFailToRegisterForRemoteNotificationsWithError:error];
}
// Required for the localNotification event.
- (void)application:(UIApplication *)application didReceiveLocalNotification:(UILocalNotification *)notification
{
  [RNCPushNotificationIOS didReceiveLocalNotification:notification];
}

NOTES:

Remove

* `#import <React/RCTPushNotificationManager.h>`

* Every method using the RCTPushNotificationManager library, make sure you have only the above ones.

Great Worked for me
Thank you

[ErtugrulBEKTIK]

@Ovsdrak I cannot Drag And Drop RNCPushNotificationIOS folder to Header Search Paths because there is no folder in yourProject/ios/Pods/Headers/Public/ folder (I did pod install).

So I get error on build as 'React/RCTEventEmitter.h' file not found in RNCPushNotificationIOS.h

Any ideas?

[lukewlms]

Mocked the whole react-native-push-notification library and that seems to work well.

jest.mock('react-native-push-notification', () => {
    return {
        addEventListener: jest.fn(),
        removeEventListener: jest.fn(),
        requestPermissions: jest.fn(),
        configure: jest.fn()
    }
});

Source: https://github.com/facebook/jest/issues/2208#issuecomment-288522674