datetimepicker: Invariant Violation: requireNativeComponent: "RNDateTimePicker" was not found in the UIManager

Bug

The component appears to not be working. Once my app reaches the screen where the component is called it crashes.

Invariant Violation: Invariant Violation: Invariant Violation: requireNativeComponent: "RNDateTimePicker" was not found in the UIManager.

This error is located at:
    in RNDateTimePicker (at datetimepicker.ios.js:81)
    in RCTView (at View.js:45)
    in View (at datetimepicker.ios.js:80)
    in Picker (at DatePicker.js:38)
    in RCTView (at View.js:45)
    in View (at DatePicker.js:31)
    in DatePicker (at HomeScreen.js:18)
    in RCTScrollContentView (at ScrollView.js:976)
    in RCTScrollView (at ScrollView.js:1115)
    in ScrollView (at HomeScreen.js:14)
    in RCTView (at View.js:45)
    in View (at HomeScreen.js:13)
    in HomeScreen (at SceneView.js:9)
    in SceneView (at DrawerView.js:149)
    in RCTView (at View.js:45)
    in View (at ResourceSavingScene.js:20)
    in RCTView (at View.js:45)
    in View (at ResourceSavingScene.js:16)
    in ResourceSavingScene (at DrawerView.js:148)
    in RCTView (at View.js:45)
    in View (at screens.native.js:83)
    in ScreenContainer (at DrawerView.js:138)
    in RCTView (at View.js:45)
    in View (at createAnimatedComponent.js:151)
    in AnimatedComponent (at DrawerLayout.js:446)
    in RCTView (at View.js:45)
    in View (at createAnimatedComponent.js:151)
    in AnimatedComponent (at DrawerLayout.js:445)
    in PanGestureHandler (at DrawerLayout.js:501)
    in DrawerLayout (at DrawerView.js:165)
    in DrawerView (at createNavigator.js:61)
    in Navigator (at createAppContainer.js:429)
    in NavigationContainer (at SceneView.js:9)
    in SceneView (at createTabNavigator.js:39)
    in RCTView (at View.js:45)
    in View (at ResourceSavingScene.js:37)
    in RCTView (at View.js:45)
    in View (at ResourceSavingScene.js:26)
    in ResourceSavingScene (at createBottomTabNavigator.js:121)
    in RCTView (at View.js:45)
    in View (at screens.native.js:83)
    in ScreenContainer (at createBottomTabNavigator.js:111)
    in RCTView (at View.js:45)
    in View (at createBottomTabNavigator.js:110)
    in TabNavigationView (at createTabNavigator.js:197)
    in NavigationView (at createNavigator.js:61)
    in Navigator (at createAppContainer.js:429)
    in NavigationContainer (at App.js:38)
    in ViewManagerAdapter_ExpoLinearGradient (at NativeViewManagerAdapter.js:49)
    in ForwardRef(Adapter<ExpoLinearGradient>) (at NativeLinearGradient.ios.js:5)
    in NativeLinearGradient (at LinearGradient.js:12)
    in LinearGradient (at App.js:37)
    in Provider (at App.js:36)
    in App (at withExpoRoot.js:20)
    in RootErrorBoundary (at withExpoRoot.js:19)
    in ExpoRootComponent (at renderApplication.js:35)
    in RCTView (at View.js:45)
    in View (at AppContainer.js:98)
    in RCTView (at View.js:45)
    in View (at AppContainer.js:115)
    in AppContainer (at renderApplication.js:34)

This error is located at:
    in NavigationContainer (at SceneView.js:9)
    in SceneView (at createTabNavigator.js:39)
    in RCTView (at View.js:45)
    in View (at ResourceSavingScene.js:37)
    in RCTView (at View.js:45)
    in View (at ResourceSavingScene.js:26)
    in ResourceSavingScene (at createBottomTabNavigator.js:121)
    in RCTView (at View.js:45)
    in View (at screens.native.js:83)
    in ScreenContainer (at createBottomTabNavigator.js:111)
    in RCTView (at View.js:45)
    in View (at createBottomTabNavigator.js:110)
    in TabNavigationView (at createTabNavigator.js:197)
    in NavigationView (at createNavigator.js:61)
    in Navigator (at createAppContainer.js:429)
    in NavigationContainer (at App.js:38)
    in ViewManagerAdapter_ExpoLinearGradient (at NativeViewManagerAdapter.js:49)
    in ForwardRef(Adapter<ExpoLinearGradient>) (at NativeLinearGradient.ios.js:5)
    in NativeLinearGradient (at LinearGradient.js:12)
    in LinearGradient (at App.js:37)
    in Provider (at App.js:36)
    in App (at withExpoRoot.js:20)
    in RootErrorBoundary (at withExpoRoot.js:19)
    in ExpoRootComponent (at renderApplication.js:35)
    in RCTView (at View.js:45)
    in View (at AppContainer.js:98)
    in RCTView (at View.js:45)
    in View (at AppContainer.js:115)
    in AppContainer (at renderApplication.js:34)

This error is located at:
    in NavigationContainer (at App.js:38)
    in ViewManagerAdapter_ExpoLinearGradient (at NativeViewManagerAdapter.js:49)
    in ForwardRef(Adapter<ExpoLinearGradient>) (at NativeLinearGradient.ios.js:5)
    in NativeLinearGradient (at LinearGradient.js:12)
    in LinearGradient (at App.js:37)
    in Provider (at App.js:36)
    in App (at withExpoRoot.js:20)
    in RootErrorBoundary (at withExpoRoot.js:19)
    in ExpoRootComponent (at renderApplication.js:35)
    in RCTView (at View.js:45)
    in View (at AppContainer.js:98)
    in RCTView (at View.js:45)
    in View (at AppContainer.js:115)
    in AppContainer (at renderApplication.js:34)
- node_modules/react-native/Libraries/ReactNative/getNativeComponentAttributes.js:29:4 in getNativeComponentAttributes
- node_modules/react-native/Libraries/Renderer/shims/ReactNativeViewConfigRegistry.js:104:25 in get
- ... 18 more stack frames from framework internals


Library version: 1.0.0

Steps To Reproduce

  1. npm install --save @react-native-community/datetimepicker
  2. expo start

Describe what you expected to happen:

  1. For a button to appear where I could press and open the date picker

About this issue

  • Original URL
  • State: closed
  • Created 5 years ago
  • Reactions: 13
  • Comments: 28 (1 by maintainers)

Most upvoted comments

Using react-native link and installing pods fixed this issue for me, on RN 0.60.3. Not sure why this section was removed from readme.

react-native link @react-native-community/datetimepicker && cd ios && pod install

@mrcl3an Did you try doing pod install and restarting the Metro Bundler?

I’ve this:

Invariant Violation: Invariant Violation: requireNativeComponent: “DatePickerManager” was not found in the UIManager.

  • node_modules/react-native/Libraries/ReactNative/getNativeComponentAttributes.js:29:4 in getNativeComponentAttributes
  • node_modules/react-native/Libraries/Renderer/shims/ReactNativeViewConfigRegistry.js:104:25 in get
  • … 18 more stack frames from framework internals

Seems sort of buggy but going into src/ios and running pod install might find the dependancy.

https://github.com/react-native-community/react-native-datetimepicker#manual-installation

Yeah, adding RNDateTimePicker to the Podfile or using an autolink mechanism from react-native should solve this problem. Also, I’ve just merged https://github.com/expo/expo/pull/6087 so this native module will be a part of the next Expo SDK (36) so you will be able to use it in managed workflow as well 🎉

Adding pod ‘RNDateTimePicker’, :path => ‘…/node_modules/@react-native-community/datetimepicker/RNDateTimePicker.podspec’ in podfile solved it.

“react-native”: “0.61.2”, “@react-native-community/datetimepicker”: “^2.1.0”, “react-native-modal-datetime-picker”: “8.x.x”,

I might be mistaken, but if you are using a managed expo workflow it seems this package will not work because expo does not support native modules and this package is a native module https://docs.expo.io/versions/latest/introduction/faq/ (search for “native modules”)

@avtarnanrey

React Native: 0.61.2 @react-native-community/datetimepicker: 2.1.0

  • install (npm install / yarn install)
  • cd ios
  • pod install

*no need to link

works for me

@Nnoerregaard I am using the bare workflow which supports native modules https://docs.expo.io. So the issue is with something else 😦

expo 35.0.0 (bare workflow) - the same issue

I have the same problem, are there any solutions?

This combination is also not working:

"@react-native-community/datetimepicker": "^2.0.0", "react": "^16.8.6", "react-native": "^0.60.5"

Same error as the original poster when building/running on iOS