search

facebook / react-native

A framework for building native applications using React
https://reactnative.dev
MIT License
119.14k stars 24.32k forks source link

Picker has been removed from React Native. It can now be installed and imported from '@react-native-picker/picker after upgrading from react-native 0.65.1 to react-native 0.68.1 #34985

Closed Aggroid closed 2 years ago

Aggroid commented 2 years ago

New Version

0.68.1

Old Version

0.65.1

Build Target(s)

iOS 14 os 16

Output of react-native info

System: OS: macOS 12.6 CPU: (12) x64 Intel(R) Core(TM) i7-9750H CPU @ 2.60GHz Memory: 1.14 GB / 16.00 GB Shell: 3.2.57 - /bin/bash Binaries: Node: 14.5.0 - /usr/local/bin/node Yarn: 1.22.4 - /usr/local/bin/yarn npm: 6.14.5 - /usr/local/bin/npm Watchman: 4.9.0 - /usr/local/bin/watchman Managers: CocoaPods: 1.11.3 - /usr/local/bin/pod SDKs: iOS SDK: Platforms: DriverKit 21.4, iOS 16.0, macOS 12.3, tvOS 16.0, watchOS 9.0 Android SDK: API Levels: 23, 25, 26, 27, 28, 29, 30, 31 Build Tools: 28.0.3, 29.0.2, 29.0.3, 30.0.0, 30.0.2 System Images: android-26 | Google Play Intel x86 Atom, android-28 | Google APIs Intel x86 Atom, android-28 | Google Play Intel x86 Atom, android-29 | Google Play Intel x86 Atom Android NDK: Not Found IDEs: Android Studio: 2020.3 AI-203.7717.56.2031.7678000 Xcode: 14.0.1/14A400 - /usr/bin/xcodebuild Languages: Java: 13.0.2 - /usr/bin/javac npmPackages: @react-native-community/cli: ^7.0.4 => 7.0.4 react: 17.0.2 => 17.0.2 react-native: 0.68.1 => 0.68.1 react-native-macos: Not Found npmGlobalPackages: react-native: Not Found

Issue and Reproduction Steps

Hey guys, I just updated my application from RN 0.65.1 to RN 0.68.1. Currently, when I'm running iOS the application is installed correctly and launched successfully e.g ( success Successfully launched the app on the simulator ) .

Once the Metro is loaded I do see this error :

ERROR Invariant Violation: Picker has been removed from React Native. It can now be installed and imported from '@react-native-picker/picker' instead of 'react-native'. See https://github.com/react-native-picker/picker

ERROR Invariant Violation: Module AppRegistry is not a registered callable module (calling runApplication). A frequent cause of the error is that the application entry file path is incorrect.

  This can also happen when the JS bundle is corrupt or there is an early initialization error when loading React Native.

ERROR Invariant Violation: Module AppRegistry is not a registered callable module (calling runApplication). A frequent cause of the error is that the application entry file path is incorrect.

  This can also happen when the JS bundle is corrupt or there is an early initialization error when loading React Native.

What bothers me is the first one e.g react-native-picker.

I do not use Picker in my code anywhere. I do not import it or export it.

Doest anyone faced that before?

Aggroid commented 2 years ago

PS If if go in node-modules/react-native and comment this code my application is working perfect :

(// Object.defineProperty(module.exports, 'Picker', { // configurable: true, // get() { // invariant( // false, // 'Picker has been removed from React Native. ' + // "It can now be installed and imported from '@react-native-picker/picker' instead of 'react-native'. " + // 'See https://github.com/react-native-picker/picker', // ); // }, // });)

But that's not a working variant for me.

cortinico commented 2 years ago

ERROR Invariant Violation: Picker has been removed from React Native. It can now be installed and imported from '@react-native-picker/picker' instead of 'react-native'. See react-native-picker/picker

Can you share a reproducer? You won't see this warning on a fresh 0.68 project so it means that either you or some of your dependency is importing Picker.

github-actions[bot] commented 2 years ago
:warning: Missing Reproducible Example
:information_source: It looks like your issue is missing a reproducible example. Please provide a Snack or a repository that demonstrates the issue you are reporting in a minimal, complete, and reproducible manner.
Aggroid commented 2 years ago

Hey cortinico unfortunately I cannot. The application is with a private source for a very big company. More than 20m users. I was looking through the node_modules to check which library is using it but was not able to find any.

Here is my package.json

"@react-native-async-storage/async-storage": "^1.13.2", "@react-native-community/checkbox": "0.5.0", "@react-native-community/cli": "^7.0.4", "@react-native-community/masked-view": "0.1.10", "@react-native-community/netinfo": "4.7.0", "@react-native-firebase/analytics": "^14.8.1", "@react-native-firebase/app": "^14.7.0", "@react-native-firebase/crashlytics": "^14.7.0", "@react-native-firebase/perf": "^14.7.0", "@react-navigation/bottom-tabs": "^5.11.15", "@react-navigation/drawer": "^5.12.9", "@react-navigation/elements": "^1.1.2", "@react-navigation/native": "^6.0.4", "@react-navigation/native-stack": "^6.2.3", "@react-navigation/stack": "^6.0.9", "@segment/analytics-react-native": "2.1.9", "@segment/analytics-react-native-plugin-amplitude-session": "^0.2.1", "@segment/analytics-react-native-plugin-appsflyer": "^0.2.1", "@segment/analytics-react-native-plugin-braze": "^0.2.1", "@segment/analytics-react-native-plugin-firebase": "^0.2.1", "@segment/sovran-react-native": "^0.2.6", "@welldone-software/why-did-you-render": "^5.0.0", "appboy": "0.0.1-security", "axios": "^0.19.0", "babel-plugin-module-resolver": "^4.0.0", "chartbeat-react-native-sdk": "^0.0.18", "diffusion": "6.6.4", "eslint-import-resolver-babel-module": "^5.1.0", "flagsmith": "^2.0.9", "fs-extra": "^8.1.0", "intl": "^1.2.5", "janus-frontend-common": "1.9.203", "jetifier": "^1.6.5", "lodash": "^4.17.15", "lottie-ios": "3.2.3", "lottie-react-native": "4.1.3", "moment": "^2.29.4", "moment-timezone": "^0.5.37-2022c", "node-libs-react-native": "^1.2.1", "prop-types": "^15.7.2", "react": "17.0.2", "react-native": "0.68.1", "react-native-animatable": "^1.3.2", "react-native-appboy-sdk": "1.35.1", "react-native-appsflyer": "6.8.0", "react-native-auth0": "2.13.3", "react-native-autoheight-webview": "^1.5.7", "react-native-bootsplash": "^3.2.3", "react-native-bottomsheet": "^2.0.1", "react-native-calendars": "^1.1266.0", "react-native-cli": "^2.0.1", "react-native-device-info": "7.3.1", "react-native-dropdown-picker": "^5.4.2", "react-native-exception-handler": "^2.10.8", "react-native-flagsmith": "^2.0.9", "react-native-geolocation-service": "5.1.1", "react-native-gesture-handler": "^1.10.3", "react-native-globals": "^0.60.3", "react-native-image-header-scroll-view": "^1.0.0", "react-native-keychain": "8.0.0", "react-native-linear-gradient": "^2.5.6", "react-native-localization": "^2.1.5", "react-native-maps": "0.27.1", "react-native-media-controls": "^2.3.0", "react-native-modal": "^11.5.6", "react-native-permissions": "^3.0.0", "react-native-reanimated": "^1.13.1", "react-native-safe-area-context": "^3.3.2", "react-native-screens": "^3.8.0", "react-native-slider": "^0.11.0", "react-native-snackbar": "^2.0.2", "react-native-snap-carousel": "^3.9.1", "react-native-svg": "12.1.1", "react-native-swipe-gestures": "^1.0.5", "react-native-tab-view": "^3.1.1", "react-native-track-player": "^2.2.0-rc4", "react-native-tracking-transparency": "^0.1.1", "react-native-userleap": "2.4.0", "react-native-vector-icons": "^8.1.0", "react-native-video": "^5.1.1", "react-native-walkthrough-tooltip": "^0.6.1", "react-native-webview": "11.14.3", "react-redux": "^7.2.6", "reanimated-bottom-sheet": "^1.0.0-alpha.18", "redux": "^4.1.2", "redux-devtools-extension": "^2.13.9", "redux-logger": "^3.0.6", "redux-saga": "^1.1.3"

I was looking at the dropdown-picker. He is using picker but custom file which is not the library from the RN.

cortinico commented 2 years ago

Hey cortinico unfortunately I cannot. The application is with a private source for a very big company.

Then I sadly can't help you further. You'll have to create a minimal reproducer that attempts to recreate this scenario.

Aggroid commented 2 years ago

Hey guys, i resolved it by updating "react-native-globals": "^0.60.3", to 0.64.0. Globals is using Picker. You can close this and I hope my answer to help someone with the same issue.

ghost commented 1 year ago

Hey @Aggroid , I am facing same issue. What is the command you used to update react-native-globals