React Native isn't compatible with yarn pnp

[scally]

Environment

[skip envinfo]
react-native info doesn't work in this scenario:
Command ``info`` unrecognized. Make sure that you have run ``npm install`` and that you are inside a react-native project.

Description

If you enable yarn pnp for a React Native app, it doesn't work. Perhaps something is hardcoded to look in ./node_modules?

The resulting error is: Error: Couldn't find a suitable Node resolution for unqualified path "<path-to-your-rn-project>/node_modules/react-native/local-cli/cli.js"

Reproducible Demo

• Create a new react native app via react-native init someproject
• cd someproject
• enable yarn pnp: yarn --enable-pnp
• yarn start

[react-native-bot]

Can you run react-native info and edit your issue to include these results under the Environment section?

If you believe this information is irrelevant to the reported issue, you may write [skip envinfo] under Environment to let us know.

[bartolkaruza]

That path is hard coded in the project.pbxproj file of the iOS app. That's just one spot though, the native app projects resolve the native module dependencies using file paths pointing to node_modules. They are unable to run a JS based resolver to find those dependencies in the current conventions of React Native. This looks like a tough nut to crack, considering the PNP proposal only seems to talk about node.js and modifying the require hook. Any modifications to RN that only accounts for PNP would mean that npm won't work with React Native anymore. Maybe you can open a discussion for this in the discussions repo? I doubt this will be resolved quickly as an issue.

[empyrical]

Metro, one part of what needs to be updated for PnP, will have its PnP resolver open sourced: facebook/metro#308

I am working on a patch for the CLI to give it the ability to see react-native & plugins when PnP is active

I am not sure about how to solve the hard-coded paths to node_modules on the XCode projects, does anyone have any ideas for this?

The Gradle and BUCK build scripts will need to be updated too.

[scally]

I am not sure about how to solve the hard-coded paths to node_modules on the XCode projects, does anyone have any ideas for this?

What if RN offered a prebuilt binary containing all the node_module requirements for a certain revision?

[empyrical]

Ideally there should be a way to do this without needing to do something like that.

[bartolkaruza]

@empyrical What if we use the install script or a new 'rnpm' like script to resolve the paths from JS using the .pnp.js file and move the native code node_modules/<lib>/android and node_modules/<lib>/ios to the original place in the node_modules of your project? That way we could side step any changes required to the native dependencies while letting the pnp mechanism handle the JS imports as intended. Would this work in the context of your platform split proposal?

[empyrical]

The Gradle and BUCK scripts should, hypothetically, be able to have some kind of helper functions written for them that could call a node subprocess, like:

node ./resolvePnP.js --module=react-native

Which would print /path/to/react-native to stdout, then prepend the result of this to wherever the path to node_modules/react-native was hard-coded.

What I don't know is if something could be done like this with XCode paths. My knowledge of XCode is weak, but could you provide a path in some way like you can in bash, like:

$(node ./resolvePnP.js --module=react-native)/path/to/code.m

?

[empyrical]

I am tackling this issue first over at the repo for react-native-cli:

react-native-community/cli#27

I think the bulk of the work for this is in the CLI half of React Native

[react-native-bot]

I am closing this issue because it does not contain the necessary environment info, and there has been no followup in a while.

If you found this thread after encountering the same issue in the latest release, please feel free to create a new issue with up-to-date information by clicking here.