`react/bunshi` import incompatible with React Native

[dmytro-saltovskyi]

I tried to use it with React Native but got a warning and an error:
warning:

warn Package bunshi has been ignored because it contains invalid configuration. Reason: Package subpath './package.json' is not defined by "exports" in path/node_modules/bunshi/package.json

error:

error: Error: Unable to resolve module bunshi/react from some path: bunshi/react could not be found within the project or in these directories:
  node_modules
  ../node_modules

Looks like it connected to that issue react-native-community/cli#1168

[caltikoc]

These warnings and errors often occur due to invalid or missing configurations within the package.json file of the package being used. To resolve these issues, follow these steps:

1. Check Package Configuration:

   • Open the package.json file within the bunshi package and ensure that the exports section defines the specified subpath or module, such as './package.json'.

2. Reinstall Dependencies in Your Project:

   • Errors are often caused by incomplete or incorrectly installed packages. Therefore, in your project directory, run npm install or yarn install in a command prompt to reinstall dependencies.

3. Update the Package Version:

   • If possible, try using an updated version of the bunshi package. Newer versions might resolve these kinds of issues.

4. Explore Alternative Solutions:

   • Search forums, GitHub issues, or platforms like Stack Overflow for experiences and solutions shared by others encountering similar problems. These resources might offer solution suggestions from individuals who have faced similar issues.

After attempting these steps, if the issue persists, consider analyzing the error message in more detail or seeking help from sources where you can find more specific information or guidance related to this error.

[loganvolkers]

Thanks for the bug report @dmitriy-saltovskiy and for the resolution steps Ali Koçaslan (@caltikoc)

I would love to see support for React Native better tested and documented.

Would either of you be open to contributing a PR with the fix and some other React Native improvements?

[kaladivo]

This is because metro does not support exports in package.json yet. But it is in beta. See this.

For me, the simplest fix was to simply import the package from bunshi/dist/react.

It should be fixed in next versions of react-native...

[loganvolkers]

Thanks for clarifying and linking out to the relevant resources David Novák (@kaladivo)

It might still be possible to fix this issue by changing the build and deploy process to move files from dist into the root folder. I believe that jotai uses this trick.

In the meantime:

• Workaround use import { molecule } from "bunshi/dist/react" instead of import { molecule } from "bunshi/react"
• Blocking waiting on package exports support in React Native

A few possible tasks for the community to tackle if anyone is keen:

• Add a React Native article to the bunshi documentation site (e.g. share the notes from this issue, the known workaround)
• Add a starter React Native project in the examples folder as a test for compatibility (i.e. make sure we don't break the known workaround of import { molecule } from "bunshi/dist/react"). See test:typings script in package.json for reference.

[sunniejai]

Hi there, any update on this issue? Seems like package exports is not supported in React native?

[solominh]

Workaround use import { molecule } from "bunshi/dist/react" instead of import { molecule } from "bunshi/react"
=> code run well but typescript complain.
I am using it with Jotai. jotai-scope is unusable right now.
I try using jotai with Context but it like reinventing the wheel.
Bunshi is the right tool to scope Jotai atom
Please fix import for react native.

[solominh]

I fix it by using alias in metro.config.js file.

const path = require('path')
config.resolver.extraNodeModules['bunshi'] = path.resolve(__dirname, 'node_modules/bunshi/dist')