Picker error when building with expo

[kjkurtz]

Bug report

Summary

While using the latest expo with the latest DateTimePicker, breaks the build for web. Although this component is not compatible with web, it has never been an issue for the build to succeed up until v6. It builds fine with v4 and v5. The following error occurs when doing expo start --web.

./node_modules/@react-native-community/datetimepicker/src/DateTimePickerAndroid.js:23
Module not found: Can't resolve './picker'
  21 |   validateAndroidProps,
  22 | } from './androidUtils';
> 23 | import pickers from './picker';
  24 | 
  25 | function open(props: AndroidNativeProps) {
  26 |   const {
./node_modules/@react-native-community/datetimepicker/src/androidUtils.js:6
Module not found: Can't resolve './picker'
  4 |  */
  5 | import {ANDROID_DISPLAY, ANDROID_MODE, MIN_MS} from './constants';
> 6 | import pickers from './picker';
  7 | import type {AndroidNativeProps, DateTimePickerResult} from './types';
  8 | import {sharedPropsValidation} from './utils';
  9 | import invariant from 'invariant';

Reproducible sample code

https://github.com/kjkurtz/test-expo-project
Run yarn install and then

Steps to reproduce

1. Include a DateTimePicker component within a view
2. Run the code using expo start --web. At this point, you should see the error

Environment info

Expo 45

System:
    OS: macOS 12.3.1
    CPU: (10) arm64 Apple M1 Pro
    Memory: 89.73 MB / 32.00 GB
    Shell: 5.8 - /bin/zsh
  Binaries:
    Node: 16.14.2 - ~/.nvm/versions/node/v16.14.2/bin/node
    Yarn: 1.22.18 - ~/.nvm/versions/node/v16.14.2/bin/yarn
    npm: 8.5.0 - ~/.nvm/versions/node/v16.14.2/bin/npm
    Watchman: Not Found
  Managers:
    CocoaPods: Not Found
  SDKs:
    iOS SDK:
      Platforms: DriverKit 21.4, iOS 15.4, macOS 12.3, tvOS 15.4, watchOS 8.5
    Android SDK: Not Found
  IDEs:
    Android Studio: 2021.2 AI-212.5712.43.2112.8512546
    Xcode: 13.3.1/13E500a - /usr/bin/xcodebuild
  Languages:
    Java: Not Found
  npmPackages:
    @react-native-community/cli: Not Found
    react: 17.0.2 => 17.0.2 
    react-native: 0.68.2 => 0.68.2 
    react-native-macos: Not Found
  npmGlobalPackages:
    *react-native*: Not Found

datetimepicker version: 6.1.2

[lehnihon]

Same here :(

[tvbegovic]

Same

[ftlno]

Same

[tvbegovic]

The code obviously has wrong imports, instead of
import pickers from './picker'
it should be
import pickers from './picker.android'

Same for few other places. It seems that the picker.js file was renamed or moved and someone forgot to update the import references.

If I do these changes locally, the build works. However, it's strange that this happens only on web, not for Android or IOS build.

[diegonava6]

@tvbegovic that is exactly the problem, I was able to locally run the project successfully doing the changes you mentioned (I have the same setup as @kjkurtz

To be specific this is what I changed:

I just added .android to each of those highlighted imports

[diegonava6]

I left a pull request for this issue
#614

[vonovak]

🎉 This issue has been resolved in version 6.1.4 🎉

If this package helps you, consider sponsoring us! 🚀