dai-shi / react-native-dom-expo

[NOT MAINTAINED] A patch library to make Expo work with react-native-dom
MIT License
26 stars 1 forks source link

Unable to resolve module AccessibilityInfo #8

Open AlfredOdling opened 5 years ago

AlfredOdling commented 5 years ago

When running expo eject I get the error:

error: bundling failed: Error: Unable to resolve module ../Components/AccessibilityInfo/AccessibilityInfo from /Users/Alfred/new-rnDOM/expo-rndom/node_modu les/react-native/Libraries/react-native/react-native-implementation.js: Module ../Components/AccessibilityInfo/AccessibilityInfo does not exist in the Hast e module map

I tried to follow vincentriemer's instructions on this: NOTE: After setting up the DOM platform you may need to run react-native start with the --reset-cache flag at least once if you recieve an error message like Unable to resolve module AccessibilityInfo.

by running node node_modules/react-native/local-cli/cli.js start --reset-cache --config ../../../react-native-dom-expo/metro.config.js

but it did not fix the issue. Do you know what could be wrong?

dai-shi commented 5 years ago

Oh, this library doen't support ejecting... at least yet.

AlfredOdling commented 5 years ago

What do you think about this (using AccessibilityInfo as an example, but almost none of the components were found);

The structure is the following: node_modules/react-native/Libraries/Components/AccessibilityInfo AccessibilityInfo.android.js AccessibilityInfo.ios.js

In node_modules/react-native/Libraries/react-native/react-native-implementation.js it imports the modules with haste as such:

Before eject

  get AccessibilityInfo() {
    return require('AccessibilityInfo');
  },

After eject

  get AccessibilityInfo() {
    return require('../Components/AccessibilityInfo/AccessibilityInfo');
  },

I'm not sure about what it is trying to do pre/post eject. Thoughts?

dai-shi commented 5 years ago

I think the module resolver of metro is so different between Expo and RN(ejected). So far, I've been only working on patching the resolver for Expo. Technically, we can do the same for ejected Expo, but for RN I think there's a better(non-hacking) way. Until we have enough power to work on this project, I'd like to focus on Expo.

dai-shi commented 5 years ago

Just curious, what would you like to do with an ejected Expo app?

I would simply create a RN app without Expo and use react-native-dom without this library.

AlfredOdling commented 5 years ago

Exactly what would be needed to make it work? Well, I really like their environment and ecosystem. I experience that I can develop faster. For example stuff like Auth, Camera and similar stuff.

AlfredOdling commented 5 years ago

And mostly, Create React Native App is now archived and replaced with Expo so I guess that the demand for this repo will increase.

dai-shi commented 5 years ago

For example stuff like Auth, Camera and similar stuff.

Those are not yet supported. It takes time and efforts. Did you try running without ejecting? There're still lots to do for unejected apps.

Exactly what would be needed to make it work?

A naive way is to make metro.config.js for ejected Expo. But again, I'm not sure if this is a good way. So, the first thing would be to come up with various possible ways.

If you want to try the naive way just for yourself, you can copy metro.config.js in this project to your RN's rn-cli.config.js and fix domModuleMap for the RN structure.

AlfredOdling commented 5 years ago

Hmm.. I would like to do that. I do not have any previous experience with tinkering this deep in the packagers before. Could you point me in the right direction of where to get the information needed to try this?

dai-shi commented 5 years ago

If you would really like to do it for trial, the simpler way would be to copy files for resolution. For example,

  get AccessibilityInfo() {
    return require('../Components/AccessibilityInfo/AccessibilityInfo');
  },

put AccessibilityInfo.dom.js to the location pointed at ../Components/AccessibilityInfo/AccessibilityInfo. You can find AccessbilityInfo.dom.js at node_modules/react-native-dom/Libraries/Components/AccessibilityInfo/AccessibilityInfo.dom.js.

I can't guarantee if that would really work, though.

If you want do it without copying files, refer https://facebook.github.io/metro/docs/en/configuration but there's not much information.

AlfredOdling commented 5 years ago

I do not have the personal resources to pursue this at the moment, so I think I'll use alternatives until this works.

dai-shi commented 5 years ago

Sure, that makes sense.

Would you let me know which modules you want to be supported? I'd like to prioritize them.

AlfredOdling commented 5 years ago

The most important ones are being able to use Google and Payments from Expo.

But, I have not really found any good explanation of what the difference of React Native DOM vs React Native Web is for the developer and when to use one and not the other.

Really the only thing I've found is that Expo says that it supports React Native DOM. Would you provide a link or an explanation? Thanks.

dai-shi commented 5 years ago

Expo is trying to support RNWEB, not RNDOM at the moment.

RNWEB is to let developers build a browser app using react-native semantics.

RNDOM is to run a react-native app in a browser.

RNDOM uses a worker thread which may not work in some environments. RNDOM is younger.

RNWEB build process might be complicated if you were to do it from scratch.

dai-shi commented 5 years ago

https://docs.expo.io/versions/v32.0.0/sdk/google/

As of SDK 32 Expo.Google is just a JS wrapper for the Expo.AppAuth library.

I think it's technically possible. Shouldn't be too difficult, hopefully. However, it's uncertain whether other libraries using the token works accordingly.

https://docs.expo.io/versions/v32.0.0/sdk/payments/

For this one, only Stripe could be supported. I have no idea how difficult it is. I'd wait for the Expo team to do anything with RNWEB.

AlfredOdling commented 5 years ago

Expo is trying to support RNWEB, not RNDOM at the moment.

RNWEB is to let developers build a browser app using react-native semantics.

RNDOM is to run a react-native app in a browser.

RNDOM uses a worker thread which may not work in some environments. RNDOM is younger.

RNWEB build process might be complicated if you were to do it from scratch.

But the docs seem to say that rndom is supported?.

Which one should one choose? Is it depending on what kind of project one is making or?

dai-shi commented 5 years ago

None of them in https://docs.expo.io/versions/v32.0.0/react-native/out-of-tree-platforms/ is really supported by Expo. Expo team is working on RNWEB. There're a bunch of *.web.js files in the repo.

So, if one want to use Expo with web in the near future, RNWEB should be the bet. Will see how SDK33 goes.

RNDOM is much younger project. The reason why we work on RNDOM in addition to RNWEB is that we foresee some good parts; potential native support, web workers, yoga, metro and so on.

AlfredOdling commented 5 years ago

Ah I see, I see.. Thanks for the info. I guess I'll move forward with rnweb then. I wish you good luck with this repo.

dai-shi commented 5 years ago

Yeah, thanks. Others may have different opinions.

dai-shi commented 5 years ago

As I get the same AccessibilityInfo error even without ejecting, I added a workaround. It doesn't mean it will work with ejecting. It's worth trying.

dai-shi commented 5 years ago

Published: https://www.npmjs.com/package/react-native-dom-expo/v/0.0.9 If you are still interested, please git it a try. @AlfredOdling

AlfredOdling commented 5 years ago

Created a new project and ran without ejecting, both ios+web worked. Ran expo eject, web worked but when running expo start and then starting ios, this message appeared:

Trying to open the project in iOS simulator...
Opening iOS simulator
Opening exp9b78eec47a2d4f6b878f7859de9757e7://127.0.0.1:19000 in iOS simulator
Error running `xcrun simctl openurl booted exp9b78eec47a2d4f6b878f7859de9757e7://127.0.0.1:19000`: An error was encountered processing the command (domain=NSOSStatusErrorDomain, code=-10814):
The operation couldn’t be completed. (OSStatus error -10814.)

Error running app. Have you installed the app already using Xcode? Since you are detached you must build manually. Error: Process exited with non-zero code: 194

Press ? to show a list of all available commands.
dai-shi commented 5 years ago

Thanks. I'm not sure about the message. I will try that too, when I have time.

dai-shi commented 5 years ago

@AlfredOdling Could you please try ejecting without installing react-native-dom and react-native-dom-expo, and then with just installing react-native-dom? You can then try installing react-native-dom-expo and see if it changes. My intuition is it won't.