`Invariant Violation: Native module cannot be null` with DatePickerIOS warnings

[mrflip]

After upgrading to expo 40 and thus @expo/vector-icons 12.0.x, my app fails at startup on iOS with "Native Module cannot be null". It works in react-native-web, and it works immediately if I pin e/v-i back to version 10.2.1. I tried to create a minimal test case by installing a blank app and replacing with my package.json but could not reproduce. I've attached the package.json and call stacks.

Not sure if this is the problem, but the create-icon-set code eventually leads to a file that re-exports * from react-native; I'm wondering if this is causing react-native to then bundle in every single thing that it could possibly export, triggering the warnings and errors seen below.

I used yarn why and grepped through things and can't find any evidence that my code or dependencies are requesting any kind of date picker or iOS notifications.

Stack trace from LogBox:

This trace is more detailed than what the console log shows, not sure why.

Stack Trace:

Warning: DatePickerIOS has been merged with DatePickerAndroid and will be removed in a future release. It can now be installed and imported from '@react-native-community/datetimepicker' instead of 'react-native'. See https://github.com/react-native-community/datetimepicker
- node_modules/react-native/Libraries/LogBox/LogBox.js:173: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/fbjs/lib/warning.js:30:4 in printWarning
- node_modules/fbjs/lib/warning.js:51:4 in <anonymous>
- node_modules/react-native/Libraries/Utilities/warnOnce.js:29:9 in warnOnce
- node_modules/react-native/index.js:134:12 in module.exports.get__DatePickerIOS
- node_modules/@expo/vector-icons/build/vendor/react-native-vector-icons/lib/react-native.js:1:0 in <global>
* [native code]:null in forEach
- node_modules/@expo/vector-icons/build/vendor/react-native-vector-icons/lib/react-native.js:1:0 in <global>
- node_modules/metro/src/lib/polyfills/require.js:321:11 in loadModuleImplementation
- node_modules/@expo/vector-icons/build/vendor/react-native-vector-icons/lib/create-icon-set.js:3:0 in <global>
- node_modules/metro/src/lib/polyfills/require.js:321:11 in loadModuleImplementation
- node_modules/@expo/vector-icons/build/createIconSet.js:4:0 in <global>
- node_modules/metro/src/lib/polyfills/require.js:321:11 in loadModuleImplementation
* http://127.0.0.1:19000/node_modules/expo/AppEntry.bundle?platform=ios&dev=true&hot=false&minify=false:131470:57 in <unknown>
- node_modules/metro/src/lib/polyfills/require.js:321:11 in loadModuleImplementation
* http://127.0.0.1:19000/node_modules/expo/AppEntry.bundle?platform=ios&dev=true&hot=false&minify=false:406372:50 in <unknown>
- node_modules/metro/src/lib/polyfills/require.js:321:11 in loadModuleImplementation
* http://127.0.0.1:19000/node_modules/expo/AppEntry.bundle?platform=ios&dev=true&hot=false&minify=false:406274:50 in <unknown>
- node_modules/metro/src/lib/polyfills/require.js:321:11 in loadModuleImplementation
* http://127.0.0.1:19000/node_modules/expo/AppEntry.bundle?platform=ios&dev=true&hot=false&minify=false:406151:55 in <unknown>
- node_modules/metro/src/lib/polyfills/require.js:321:11 in loadModuleImplementation
* http://127.0.0.1:19000/node_modules/expo/AppEntry.bundle?platform=ios&dev=true&hot=false&minify=false:403195:28 in <unknown>
- node_modules/metro/src/lib/polyfills/require.js:321:11 in loadModuleImplementation
* http://127.0.0.1:19000/node_modules/expo/AppEntry.bundle?platform=ios&dev=true&hot=false&minify=false:403046:50 in <unknown>
- node_modules/metro/src/lib/polyfills/require.js:321:11 in loadModuleImplementation
* http://127.0.0.1:19000/node_modules/expo/AppEntry.bundle?platform=ios&dev=true&hot=false&minify=false:402577:40 in <unknown>
- node_modules/metro/src/lib/polyfills/require.js:321:11 in loadModuleImplementation
* http://127.0.0.1:19000/node_modules/expo/AppEntry.bundle?platform=ios&dev=true&hot=false&minify=false:395118:28 in <unknown>
- node_modules/metro/src/lib/polyfills/require.js:321:11 in loadModuleImplementation
* http://127.0.0.1:19000/node_modules/expo/AppEntry.bundle?platform=ios&dev=true&hot=false&minify=false:393904:26 in <unknown>
- node_modules/metro/src/lib/polyfills/require.js:321:11 in loadModuleImplementation
* http://127.0.0.1:19000/node_modules/expo/AppEntry.bundle?platform=ios&dev=true&hot=false&minify=false:133392:26 in <unknown>
- node_modules/metro/src/lib/polyfills/require.js:321:11 in loadModuleImplementation
* http://127.0.0.1:19000/node_modules/expo/AppEntry.bundle?platform=ios&dev=true&hot=false&minify=false:133366:47 in <unknown>
- node_modules/metro/src/lib/polyfills/require.js:321:11 in loadModuleImplementation
- node_modules/expo/AppEntry.js:3:0 in <global>
- node_modules/metro/src/lib/polyfills/require.js:321:11 in loadModuleImplementation
- node_modules/metro/src/lib/polyfills/require.js:201:44 in guardedLoadModule
* http://127.0.0.1:19000/node_modules/expo/AppEntry.bundle?platform=ios&dev=true&hot=false&minify=false:562455:3 in global code

Warning: DatePickerAndroid has been merged with DatePickerIOS and will be removed in a future release. It can now be installed and imported from '@react-native-community/datetimepicker' instead of 'react-native'. See https://github.com/react-native-community/datetimepicker
- node_modules/react-native/Libraries/LogBox/LogBox.js:173: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/fbjs/lib/warning.js:30:4 in printWarning
- node_modules/fbjs/lib/warning.js:51:4 in <anonymous>
- node_modules/react-native/Libraries/Utilities/warnOnce.js:29:9 in warnOnce
- node_modules/react-native/index.js:319:12 in module.exports.get__DatePickerAndroid
- node_modules/@expo/vector-icons/build/vendor/react-native-vector-icons/lib/react-native.js:1:0 in <global>
* [native code]:null in forEach
- node_modules/@expo/vector-icons/build/vendor/react-native-vector-icons/lib/react-native.js:1:0 in <global>
- node_modules/metro/src/lib/polyfills/require.js:321:11 in loadModuleImplementation
- node_modules/@expo/vector-icons/build/vendor/react-native-vector-icons/lib/create-icon-set.js:3:0 in <global>
- node_modules/metro/src/lib/polyfills/require.js:321:11 in loadModuleImplementation
- node_modules/@expo/vector-icons/build/createIconSet.js:4:0 in <global>
- node_modules/metro/src/lib/polyfills/require.js:321:11 in loadModuleImplementation
* http://127.0.0.1:19000/node_modules/expo/AppEntry.bundle?platform=ios&dev=true&hot=false&minify=false:131470:57 in <unknown>
- node_modules/metro/src/lib/polyfills/require.js:321:11 in loadModuleImplementation
* http://127.0.0.1:19000/node_modules/expo/AppEntry.bundle?platform=ios&dev=true&hot=false&minify=false:406372:50 in <unknown>
- node_modules/metro/src/lib/polyfills/require.js:321:11 in loadModuleImplementation
* http://127.0.0.1:19000/node_modules/expo/AppEntry.bundle?platform=ios&dev=true&hot=false&minify=false:406274:50 in <unknown>
- node_modules/metro/src/lib/polyfills/require.js:321:11 in loadModuleImplementation
* http://127.0.0.1:19000/node_modules/expo/AppEntry.bundle?platform=ios&dev=true&hot=false&minify=false:406151:55 in <unknown>
- node_modules/metro/src/lib/polyfills/require.js:321:11 in loadModuleImplementation
* http://127.0.0.1:19000/node_modules/expo/AppEntry.bundle?platform=ios&dev=true&hot=false&minify=false:403195:28 in <unknown>
- node_modules/metro/src/lib/polyfills/require.js:321:11 in loadModuleImplementation
* http://127.0.0.1:19000/node_modules/expo/AppEntry.bundle?platform=ios&dev=true&hot=false&minify=false:403046:50 in <unknown>
- node_modules/metro/src/lib/polyfills/require.js:321:11 in loadModuleImplementation
* http://127.0.0.1:19000/node_modules/expo/AppEntry.bundle?platform=ios&dev=true&hot=false&minify=false:402577:40 in <unknown>
- node_modules/metro/src/lib/polyfills/require.js:321:11 in loadModuleImplementation
* http://127.0.0.1:19000/node_modules/expo/AppEntry.bundle?platform=ios&dev=true&hot=false&minify=false:395118:28 in <unknown>
- node_modules/metro/src/lib/polyfills/require.js:321:11 in loadModuleImplementation
* http://127.0.0.1:19000/node_modules/expo/AppEntry.bundle?platform=ios&dev=true&hot=false&minify=false:393904:26 in <unknown>
- node_modules/metro/src/lib/polyfills/require.js:321:11 in loadModuleImplementation
* http://127.0.0.1:19000/node_modules/expo/AppEntry.bundle?platform=ios&dev=true&hot=false&minify=false:133392:26 in <unknown>
- node_modules/metro/src/lib/polyfills/require.js:321:11 in loadModuleImplementation
* http://127.0.0.1:19000/node_modules/expo/AppEntry.bundle?platform=ios&dev=true&hot=false&minify=false:133366:47 in <unknown>
- node_modules/metro/src/lib/polyfills/require.js:321:11 in loadModuleImplementation
- node_modules/expo/AppEntry.js:3:0 in <global>
- node_modules/metro/src/lib/polyfills/require.js:321:11 in loadModuleImplementation
- node_modules/metro/src/lib/polyfills/require.js:201:44 in guardedLoadModule
* http://127.0.0.1:19000/node_modules/expo/AppEntry.bundle?platform=ios&dev=true&hot=false&minify=false:562455:3 in global code

Unable to start your application. Please refer to https://expo.fyi/no-registered-application for more information.
- node_modules/react-native/Libraries/LogBox/LogBox.js:117:10 in registerWarning
- node_modules/react-native/Libraries/LogBox/LogBox.js:63:8 in warnImpl
- node_modules/react-native/Libraries/LogBox/LogBox.js:36:4 in console.warn
- node_modules/expo/build/environment/react-native-logs.fx.js:18:4 in warn
- node_modules/react-native/Libraries/ReactNative/AppRegistry.js:200:6 in runApplication
- node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:416:4 in __callFunction
- node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:109: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:108:4 in callFunctionReturnFlushedQueue
* [native code]:null in callFunctionReturnFlushedQueue

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

package.json

{
  "name": "...",
  "main": "node_modules/expo/AppEntry.js",
  "version": "0.0.23",
  "private": true,
  "type": "module",
  "scripts": {
    "start": "expo start",
    "android": "expo start --android",
    "ios": "expo start --ios",
    "web": "expo start --web",
    "test": "jest --watchAll",
    "flow": "flow",
    "genall": "cd ../valar && yarn genall",
    "lintfrom": "grep from src/*/* | ruby -ne 'puts \"%-48s %s\" % $_.split(\":\")'",
    "lint": "eslint App.js src/",
    "lint1": "eslint",
    "publish": "expo publish",
    "release": "standard-version --release-as patch",
    "build": "next build"
  },
  "jest": {
    "preset": "jest-expo",
    "testRegex": "(/_+tests_*/.*|(\\.|/)(test|spec))\\.jsx?$"
  },
  "husky": {
    "hooks": {
      "pre-push": "yarn lint"
    }
  },
  "dependencies": {
    "@babel/runtime": "^7.12.5",
    "@expo/vector-icons": "^10.2.1",
    "@react-native-community/masked-view": "0.1.10",
    "@react-native-community/netinfo": "5.9.7",
    "@react-native-firebase/app": "^10.1.0",
    "@react-navigation/core": "^5.14.4",
    "@react-navigation/material-bottom-tabs": "^5.3.10",
    "@react-navigation/native": "^5.8.10",
    "@react-navigation/stack": "^5.12.8",
    "@unimodules/core": "^6.0.0",
    "@urql/core": "^1.16.1",
    "@urql/devtools": "^2.0.2",
    "@urql/exchange-graphcache": "^3.2.0",
    "@urql/exchange-populate": "^0.2.1",
    "@urql/exchange-retry": "^0.2.0",
    "aws-amplify": "^3.3.10",
    "expo": "~40.0.0",
    "expo-app-loading": "^1.0.1",
    "expo-asset": "~8.2.1",
    "expo-barcode-scanner": "~9.1.0",
    "expo-constants": "~9.3.3",
    "expo-device": "~2.4.0",
    "expo-firebase-analytics": "~2.6.0",
    "expo-firebase-core": "~1.3.0",
    "expo-font": "~8.4.0",
    "expo-linking": "~2.0.0",
    "expo-permissions": "~10.0.0",
    "expo-splash-screen": "~0.8.1",
    "expo-updates": "~0.4.1",
    "expo-web-browser": "~8.6.0",
    "firebase": "7.9.0",
    "formik": "^1.5.8",
    "graphql": "^15.4.0",
    "graphql-tag": "^2.11.0",
    "lodash": "^4.17.20",
    "luxon": "^1.25.0",
    "react": "16.13.1",
    "react-dom": "16.13.1",
    "react-native": "https://github.com/expo/react-native/archive/sdk-40.0.1.tar.gz",
    "react-native-elements": "^2.3.2",
    "react-native-gesture-handler": "~1.8.0",
    "react-native-keyboard-aware-scroll-view": "^0.9.2",
    "react-native-numeric-input": "https://github.com/himelbrand/react-native-numeric-input.git",
    "react-native-paper": "^4.0.1",
    "react-native-reanimated": "~1.13.0",
    "react-native-safe-area-context": "3.1.9",
    "react-native-screens": "~2.15.0",
    "react-native-vector-icons": "^7.1.0",
    "react-native-web": "~0.13.12",
    "sprintf-js": "^1.1.2",
    "unimodules-barcode-scanner-interface": "~5.4.0",
    "unimodules-permissions-interface": "~5.4.0",
    "urql": "^1.11.3",
    "wonka": "^4.0.15",
    "yup": "0.32.8"
  },
  "devDependencies": {
    "@babel/core": "~7.12.10",
    "@babel/eslint-parser": "^7.12.1",
    "@babel/plugin-transform-modules-commonjs": "^7.12.1",
    "@babel/plugin-transform-runtime": "^7.12.10",
    "babel-preset-expo": "8.3.0",
    "eslint": "^7.14.0",
    "eslint-config-airbnb": "^18.2.1",
    "eslint-plugin-import": "^2.22.1",
    "eslint-plugin-jsx-a11y": "^6.4.1",
    "eslint-plugin-react": "^7.21.5",
    "eslint-plugin-react-hooks": "^4.2.0",
    "eslint-plugin-react-native": "^3.10.0",
    "jest-expo": "^40.0.0",
    "standard-version": "^9.0.0",
    "standard-version-expo": "^1.0.3"
  }
}

function BabelConfig(api) {
  api.cache(true)
  return {
    presets: [
      ['babel-preset-expo', { lazyImports: true }],
    ],
    plugins: [
      ['@babel/plugin-transform-runtime'],
      ['@babel/plugin-transform-modules-commonjs', { strictMode: false, allowTopLevelThis: true, loose: true }],
    ],
  }
}
module.exports = BabelConfig

[mrflip]

Yarn.lock file: https://gist.github.com/mrflip/3c0ca8931cee0fae1784b7bee902c898

I'd welcome advice for how to better create a minimal breaking example.

The error persists on a fresh clone of my repo, creating a brand-new yarn.lock and node_modules folder, into a wiped ios simulator device. Toggling between v12 and v10 toggles the brokenness on or off.

[brentvatne]

we don't import date picker in this repo at all, i'd try checking your node_modules to see where that's coming from