viewstools / yarn-workspaces-cra-crna

How to use yarn workspaces with Create React App and Create React Native App (Expo) to share common code across
151 stars 23 forks source link

metro-bundler-config-yarn-workspaces: ambiguous resolution of react-native #16

Closed Ashoat closed 6 years ago

Ashoat commented 6 years ago

I am trying to use yarn workspaces together with React Native. Previously, I was using react-native@0.52.0, metro@0.24.7, and yarn@1.60, and everything was working fine out-of-the-box. I didn't need a custom rn-cli.config.js.

After upgrading to react-native@0.55.4 and metro@0.30.2, things are no longer working cleanly. The list of watched directories that Metro prints when it starts up no longer includes the root folder of the monorepo, and as such attempts to resolve "secondary" dependencies (ie. dependencies of dependencies, which yarn workspaces store in the root folder) fail.

I'm trying to use the metro-bundler-config-yarn-workspaces package to rectify the situation. However, I'm getting an ambiguous resolution error when I try to use it:

error: bundling failed: ambiguous resolution: module `/Users/ashoat/Dropbox/src/Sites/squadcal/native/app.react.js` tries to require `react-native`, but there are several files providing this module. You can delete or fix them:

  * `/Users/ashoat/Dropbox/src/Sites/squadcal/native/node_modules/react-native/package.json`
  * `/Users/ashoat/Dropbox/src/Sites/squadcal/node_modules/react-native/package.json`

Perhaps the blacklist is misconfigured? Would appreciate any help I could get. If you'd like more details, the issue I posted on the metro repo has them.

Ashoat commented 6 years ago

This issue was fixed by simply following the instructions regarding crna-make-symlinks-for-yarn-workspaces. I was a bit confused which pieces I needed (since I already have most of these pieces working).

For anybody who stumbles on this issue, and is using a vanilla React Native config without Expo, the steps you need to follow start with yarn add --dev metro-bundler-config-yarn-workspaces crna-make-symlinks-for-yarn-workspaces and end with "prestart": "node link-workspaces.js".

Thanks for making these helpful instructions, and sorry for the issue spam! Closing now.

sibelius commented 5 years ago

@Ashoat do you have an example of this package with vanilla react native project without expo?

Ashoat commented 5 years ago

metro-bundler-config-yarn-workspaces wasn't updated to work with recent React Native/Metro versions, so I made my own metro.config.js that uses get-yarn-workspaces directly. At the time I was investigating, the config file had to be in the root yarn workspaces folder, and it wasn't possible to override this. Hopefully that will be fixed soon.

My SquadCal repo is a working example of yarn workspaces with a React Native project. I also have my custom version of crna-make-symlinks-for-yarn-workspaces, though I'm not sure why I did this and whether it was necessary.

sibelius commented 5 years ago

how do you run react-native cli commands?

from root or inside native folder?

Ashoat commented 5 years ago

From the native folder.