I'm building a React Native app, where I'm running into the following issue: the package @react-native-picker/picker is being included by two different node modules. Because of this I run into the error:
tried to register two views with the same name RNCPicker.
I have tried using a "resolutions" block in the apps package.json with @react-native-picker/picker specified, but it doesn't help.
yarn why shows the following:
yarn why v1.22.5
[1/4] Why do we have the module "@react-native-picker/picker"...?
[2/4] Initialising dependency graph...
[3/4] Finding dependency...
[4/4] Calculating file sizes...
=> Found "@react-native-picker/[email protected]"
info Reasons this module exists
- "native-base" depends on it
- Hoisted from "native-base#@react-native-picker#picker"
- Hoisted from "component-library#react-native-picker-select#@react-native-picker#picker"
info Disk size without dependencies: "488KB"
info Disk size with unique dependencies: "488KB"
info Disk size with transitive dependencies: "488KB"
info Number of shared dependencies: 0
The component-library package is my own, which contains a component which imports react-native-picker-select. Commenting out the import solves the "two views" error, but this obviously isn't a fix.
What is the correct way to fix this? Seems to me like the dependency should be shared between the two node modules so only one is registered? Isn't this what is supposed to happen with the hoisting?
The error showed up after updating react-native-picker-select to the latest version (8.0.4) in the component-library node modules. The latest version switched to using @react-native-picker/picker.
Edit: I have a workaround for the issue, but this still isn't a proper fix. Including @react-native-picker/picker in the apps package.json and manually removing node_modules/component-library/node_modules/@react-native-picker/picker at least makes the error disappear and the app run again, with a working react-native-picker-select component.