react-native-monorepo-tools VS customize-cra

Second app with bare RN. Similar story. It doesn't work. I googled and found this https://github.com/mmazzarolo/react-native-monorepo-tools . But still doesn't work... I found some random example https://github.com/aws-samples/aws-sdk-js-tests/blob/main/packages/react-native/metro.config.js and wow it works. I skip the confusion with tsconfig.json, setting path etc.

Install CRACO and react-native-monorepo-tools:

Last but not least, use react-native-monorepo-tools to make metro compatible with Yarn Workspaces:

To do so, install react-native-monorepo-tools, a set of utilities for making metro compatible with Yarn workspaces based on our nohoist list.

Install react-app-rewired and customize-cra:

If Create React App supported Yarn workspaces out-of-the-box, what we've done so far would have been enough to run the app... unfortunately, it doesn't. Luckily, we can use CRACO (or other tools such as customize-cra or react-app-rewired) to customize the Webpack configuration used by Create React App to resolve packages imported from other workspaces.

Now, for customize-cra to work we need to modify the config-overrides.js file once again. The override method from customize-cra receives a list of functions, so we need to change the signature like this:

Eventually, you might need to customize your project beyond what Create React App allows you to do. Most of these customizations will probably be just slight changes to the Webpack and Babel configuration of Create React App where ejecting would be overkill — which is why you might wanna use something like react-app-rewired, customize-cra, or craco to apply these changes without ejecting.