picker icon indicating copy to clipboard operation
picker copied to clipboard

`RNCAndroidDropdownPicker was not found in the UIManager`

Open Twinbird24 opened this issue 2 years ago • 6 comments

I'm getting an error on both iOS and android (requireNativeComponent: "RNCPicker" was not found in the UIManager and RNCAndroidDropdownPicker was not found in the UIManager, respectively) when I try to use a component from a private component library that wraps this picker.

The component library has @react-native-picker/picker (2.4.1) installed as a dependency, and loads the picker just fine when running tests or inside of Storybook. This leads me to believe that this picker loads some native code (i.e. via autolinking), which somehow isn't being properly loaded when I pull in this picker through the 3rd party component library.

Twinbird24 avatar Jun 27 '22 21:06 Twinbird24

On Android I fixed this problem trying a Manual Installation.

Android Open application file (android/app/src/main/java/[...]/MainApplication.java) Add import com.reactnativecommunity.picker.RNCPickerPackage; to the imports at the top of the file Add new RNCPickerPackage() to the list returned by the getPackages() method Append the following lines to android/settings.gradle: include ':@react-native-picker_picker' project(':@react-native-picker_picker').projectDir = new File(rootProject.projectDir, '../node_modules/@react-native-picker/picker/android') Insert the following lines inside the dependencies block in android/app/build.gradle: implementation project(path: ':@react-native-picker_picker')

I didn't try on iOS tho.

Don't forget to restart with npx react-native start and rebuild your project.

Good luck.

fabiofa87 avatar Jun 29 '22 15:06 fabiofa87

@Twinbird24 Hi!

I solved this problem only by creating a new expo application via the expo cli. Then I added the Picker package and everything worked. After that, I moved the updated package.json parts in the main application. So in my package.json updated expo to version 45 and the rest of the dependencies that were needed for this.

Here is my package.json

"dependencies": {
    "@react-native-async-storage/async-storage": "~1.17.3",
    "@react-native-community/datetimepicker": "6.1.2",
    "@react-native-picker/picker": "2.4.0",
    "expo": "~45.0.0",
    "expo-blur": "~11.1.0",
    "expo-linear-gradient": "~11.3.0",
    "expo-splash-screen": "~0.15.1",
    "expo-status-bar": "~1.3.0",
    "expo-updates": "~0.13.3",
    "react": "17.0.2",
    "react-dom": "17.0.2",
    "react-native": "0.68.2",
    "react-native-linear-gradient": "^2.5.6",
    "react-native-svg": "12.3.0",
    "react-native-web": "0.17.7",
    "victory-native": "^36.2.1"
  }

YakovlevCoded avatar Jul 12 '22 14:07 YakovlevCoded

@YakovlevCoded I'm not sure I understand your solution. The issue is not that I'm having trouble loading the Picker in my app per se, it's that I was having trouble loading it when it was installed as part of a 3rd party package (i.e. a component library dependency had this Picker as its dependency). I'm also not using Expo so I'm not sure what you said applies to me anyway.

@fabiofa87 I think the same applies to your solution, my problem wasn't getting the Picker to load in my app, it's getting it to load without having to explicitly add it as a dependency because it's already a dependency of the component lib that I'm importing.

I have the Picker installed as a dependency currently and it's working, and have the Picker as a peer-dependency on the 3rd party component lib. It's not the best solution but it'll have to do for now. Otherwise I think I would have to add some script to my component lib to set-up autolinking or modify the native code of the consumer to get the picker to work without needing to specify it as a peer-dependency.

Twinbird24 avatar Jul 13 '22 14:07 Twinbird24

Try Restarting the Simulator/Metro Bundler after pod install.

https://github.com/react-native-picker/picker/issues/45#issuecomment-576119283

I forget this every single time!

Keshavdulal avatar Jul 21 '22 16:07 Keshavdulal

@Twinbird24

I'm getting the exact same error when importing a component from an external library that uses this package.

Similarly the component works fine when the consuming app directly adds this package to its dependencies, but not without doing that.

Did you ever find a solution?

I'm also going to have to add it to the peer deps of the library and add it to the main app, but like you say it's less than ideal.

palmer-rm avatar Feb 23 '23 15:02 palmer-rm

@palmer-rm Haven't found anything yet, but I haven't been looking. I still have it as a peer dep in the component library and have it added to my main project as a dependency—this has been working fine so far so haven't been spending more time on finding a proper solution.

Twinbird24 avatar Feb 23 '23 15:02 Twinbird24