WIP: Importing from shared dir

[pcowgill]

Issue link

#336

Auto-close the issue?

Closes #336

Types of changes

Technical debt (a code change that doesn't fix a bug or add a feature but makes something clearer for devs)

Notes

This seems like it should be working based on comments I found when googling like this one facebook/react-native#12241 (comment), but it isn't working yet.

[pcowgill]

This might be related expo/expo@1c24b4e

[marcelomorgado]

Do you want that I take a look on this?

[pcowgill]

Do you want that I take a look on this?

@marcelomorgado Sure, that would be great! Thanks!

[pcowgill]

@marcelomorgado This is the clearest reference repo I found, where there's an expo app that uses a shared component https://github.com/MPiwowarski/react-native-adjacent-imports

[pcowgill]

@marcelomorgado This is the clearest reference repo I found, where there's an expo app that uses a shared component https://github.com/MPiwowarski/react-native-adjacent-imports

I found it here facebook/react-native#12241 (comment)

[pcowgill]

Having looked at the path docs, either resolve or join is a perfectly sensible approach to achieve the same thing

[pcowgill]

What do you mean by Use same var for the shared dir?

[marcelomorgado]

You've created var shared = path.join(__dirname, "../shared");. I've introduced watchFolders: [path.resolve(__dirname, "../shared")],, I've meant to used shared variable one watchFolders too if is possible.

[pcowgill]

Ah ok, understood!

[marcelomorgado]

Now, we're getting this error (from expo-cli):
Unable to resolve "@babel/runtime/helpers/interopRequireDefault" from "../shared/components/presentational/Button.js"

[pcowgill]

Unable to resolve "@babel/runtime/helpers/interopRequireDefault"

@marcelomorgado Did you do npm i in the shared dir before running the decentraland app when you saw this?

[pcowgill]

@marcelomorgado I'm getting this naming collision for react-native which is a dep of both the shared dir and the decentraland dir, but that's to be expected.

[16:47:11] (node:64828) UnhandledPromiseRejectionWarning: Error: jest-haste-map: @providesModule naming collision:
[16:47:11]   Duplicate module name: react-native
[16:47:11]   Paths: /Users/paulcowgill/Code/tasitlabs/tasit/shared/node_modules/react-native/package.json collides with /Users/paulcowgill/Code/tasitlabs/tasit/decentraland/node_modules/react-native/package.json

I know I saw someone handling that in one of the threads I looked at while researching this. I'll look for that.

Side note: If there are enough shared deps we might want lerna in this repo too #374

[pcowgill]

I'm thinking about splitting the deps up like this. At this point almost all of hte deps can probably go in the shared dir unless we're really sure it's decentraland-specific or a now-debatable choice we might move away from for tech debt reasons like redux.

[pcowgill]

Or maybe I spoke too soon:

[17:06:44] Error: Can't find react-native in package.json dependencies

[17:06:44] Error: React Native is not installed. Please run `npm install` in your project directory.

[17:06:44] Couldn't start project. Please fix the errors and restart the project.

[17:06:44] Set EXPO_DEBUG=true in your env to view the stack trace.

I'll keep researching how others have done this

[pcowgill]

This was the related comment I remembered expo/create-react-native-app#232 (comment)

[pcowgill]

metro changed their config format, but this suggestion seems like it will work:

facebook/metro#7 (comment)

[pcowgill]

metro changed their config format, but this suggestion seems like it will work:

facebook/metro#7 (comment)

I think this is the right direction to be headed in, but it hasn't solved the issue of complaining about duplicated react and react-native deps just yet.

[pcowgill]

Unable to resolve "@babel/runtime/helpers/interopRequireDefault"

@marcelomorgado Did you do npm i in the shared dir before running the decentraland app when you saw this?

@marcelomorgado I'm not seeing the babel issue - does running npm i address it for you?

[marcelomorgado]

Unable to resolve "@babel/runtime/helpers/interopRequireDefault"

@marcelomorgado Did you do npm i in the shared dir before running the decentraland app when you saw this?

@marcelomorgado I'm not seeing the babel issue - does running npm i address it for you?

I'm getting the same error:

[16:09:04] Error: Can't find react-native in package.json dependencies

[16:09:04] Error: React Native is not installed. Please run `npm install` in your project directory.

[16:09:04] Couldn't start project. Please fix the errors and restart the project.

[16:09:04] Set EXPO_DEBUG=true in your env to view the stack trace.

[pcowgill]

Unable to resolve "@babel/runtime/helpers/interopRequireDefault"

@marcelomorgado Did you do npm i in the shared dir before running the decentraland app when you saw this?

@marcelomorgado I'm not seeing the babel issue - does running npm i address it for you?

I'm getting the same error:

[16:09:04] Error: Can't find react-native in package.json dependencies

[16:09:04] Error: React Native is not installed. Please run `npm install` in your project directory.

[16:09:04] Couldn't start project. Please fix the errors and restart the project.

[16:09:04] Set EXPO_DEBUG=true in your env to view the stack trace.

If I include react-native as a dep in both decentraland and shared, that issue goes away, but then I get the duplicated provides module error. Which I thought extraNodeModules would address