react-native support

[tyrauber]

I am interested in exploring the use yjs in react-native and expo, using valitio-yjs and y-websocket. I've started by porting the valtio-yjs-demo to react-native. Here is a an expo snack for the purpose of developing and testing the implementation.

Unfortunately, there are some issues with importing yjs in react-native, specifically related to lib0 as dependency.

The snack fails to resolve yjs as a dependency due to lib0:

Failed to resolve dependency 'yjs@^13.5.24' (export 'Observable' (imported as 'Observable') was not found in 'lib0/observable' (module has no exports)

If you download the example and run it locally, the metro.config.js file, when configured to resolve .mjs and .cjs files, successfully imports and runs in the web browser. But runs into some errors when trying to run it in the iOS simulator:

While trying to resolve module `isomorphic.js` from file `~/valtio-yjs-expo/node_modules/lib0/dist/random.cjs`, the package `~/valtio-yjs-expo/node_modules/isomorphic.js/package.json` was successfully found. However, this package itself specifies a `main` module field that could not be resolved (`~/valtio-yjs-expo/node_modules/isomorphic.js/browser.mjs`. Indeed, none of these files exist:

This issue is also referenced upstream at dai-shi/valtio-yjs/issues/20 and yjs/yjs/issues/381.

Steps to reproduce the issue:

1. Download the zip
2. install the dependencies yarn
3. run in the browser yarn web - success
4. run in the iOS simulator yarn ios - fail

Expected behavior A clear and concise description of what you expected to happen.

Environment Information

"yjs": "^13.5.24",
"lib0": "^0.2.43",
"valtio": "^1.2.9",
"valtio-yjs": "^0.3.0",
"y-websocket": "^1.3.18"

[dmonad]

If the issue is related to isomorphic.js, which version did your package manager resolve to? Can you please add that to the description? Just check the node_modules/isomorphich.js/package.json file.

[dmonad]

I checked the latest release, and it does contain the mentioned files. So this seems to be an issue with your bundler..

[zjywill]

"y-websocket": "^1.3.18",
"yjs": "^13.5.24",
"zustand": "^3.5.6",
"zustand-middleware-yjs": "^1.2.6"

replace metro.config.js to

module.exports = {
    transformer: {
      getTransformOptions: async () => ({
        transform: {
          experimentalImportSupport: false,
          inlineRequires: false,
        },
      }),
    },
    resolver: {
      sourceExts: ['jsx', 'js', 'ts', 'tsx', 'cjs', 'cms', 'mjs'], //add here
    },
  };

[dmonad]

That is the information in the package.json. I need the resolved versions. Please check package-lock or yarn-lock.