Invariant Violation: Native Module cannot be Null. Error only showing up on iOS

Question

Background I've been developing a React Native app managed by Expo for almost a year now, but was unable to test it on iOS given I didn't have neither a Mac nor an iPhone at my disposal back then. I managed to buy an iPhone 8 and today I tried running the app on it to no result.

Problem I get an Invariant violation: Native module cannot be null when trying to run the app. The error stack reads as follows in VS Code:

Invariant Violation: Native module cannot be null.
- node_modules\react-native\Libraries\LogBox\LogBox.js:148:8 in registerError
- node_modules\react-native\Libraries\LogBox\LogBox.js:59:8 in errorImpl
- node_modules\react-native\Libraries\LogBox\LogBox.js:33:4 in console.error
- node_modules\expo\build\environment\react-native-logs.fx.js:27:4 in error
- node_modules\react-native\Libraries\Core\ExceptionsManager.js:104:6 in reportException
- node_modules\react-native\Libraries\Core\ExceptionsManager.js:171:19 in handleException
- node_modules\react-native\Libraries\Core\setUpErrorHandling.js:24:6 in handleError
- node_modules\expo-error-recovery\build\ErrorRecovery.fx.js:9:32 in ErrorUtils.setGlobalHandler$argument_0
- node_modules\regenerator-runtime\runtime.js:63:36 in tryCatch
- node_modules\regenerator-runtime\runtime.js:293:29 in invoke
- node_modules\regenerator-runtime\runtime.js:63:36 in tryCatch
- node_modules\regenerator-runtime\runtime.js:154:27 in invoke
- node_modules\regenerator-runtime\runtime.js:164:18 in PromiseImpl.resolve.then$argument_0
- node_modules\react-native\node_modules\promise\setimmediate\core.js:37:13 in tryCallOne
- node_modules\react-native\node_modules\promise\setimmediate\core.js:123:24 in setImmediate$argument_0
- node_modules\react-native\Libraries\Core\Timers\JSTimers.js:130:14 in _callTimer
- node_modules\react-native\Libraries\Core\Timers\JSTimers.js:181:14 in _callImmediatesPass
- node_modules\react-native\Libraries\Core\Timers\JSTimers.js:441:30 in callImmediates
- node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:387:6 in __callImmediates
- node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:135:6 in __guard$argument_0
- node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:364:10 in __guard
- node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:134:4 in flushedQueue
* [native code]:null in flushedQueue
* [native code]:null in invokeCallbackAndReturnFlushedQueue

And these screenshots show what I get on my phone:

If I try and follow the links to the screens I've coded, not the random node_modules dependencies I land at these snippets of code:

1. Filters

                   <View style={styles.check}>
                        <Text style={styles.propName}>Happy hour</Text>
                    <CheckBox
                        value={selectedExtra ? true : extra3}
                        onValueChange={() => setExtra3(!extra3)}
                        tintColors={tintColors}
                        />
                    </View>
   

2. Profile Screen

        <TouchableOpacity style={styles.listItem} onPress={() => navigation.navigate('yourPurchases')}>
            <Text style={styles.listText}>Your orders</Text>
            <View style={styles.greyArrow}>
              <GreyArrow />
            </View>
          </TouchableOpacity>

(Grey Arrow and Stylesheet imports are just fine. Navigation and everything else works perfectly on Android).

What I've tried

The application runs perfectly on Android, running into 0 issues. I've tried npx react-native link, uninstalling and reinstalling all dependencies, building and running first on Android and then on iOS. As this is an expo managed app, as far as I know I can't use the "cd /ios --> pod install" method.

Question

How can I get the app to run on iOS and what is generating the crashes?

Thanks a whole lot in advance!

Answer 1

It seems that you added a library which has a native iOS-part and is not part of Expo. You should check your package.json and for each library check on Github if there is an iOS-Folder. If this library is not mentionioning anything about Expo and Expo does not show it either on their website for being compatible with managed project, it is probably the reason and you need to find the alternative for that or eject.

Answer 2

If your using older EXPO version then update it to latest version. First uninstall it and run npm install -g expo-cli. Then clear your node modules folder and run npm install to install node modules again.

Answer 3

I often saw this error in the past. This problem occurs when ios native module is not installed properly. You should install native module for ios.

Follow the next step in your react-native project

cd ios
rm -rf Pods Podfile.lock
pod install
yarn ios

Thank you!