Pass custom-placed metro.config.js through --config to run-android and run-ios commands

Describe the Feature

At Shopify, we are using the React Native CLI in a monorepo setup:

react-native-packages/
  node_modules/
  fixture/
      node_modules/
      metro.config.js
      android/
      ...
  packages/
  ...

Since the CLI launches the packager taking the directory where React Native lives as the working directory, it causes the packager command to try reading the Metro configuration from the wrong directory - react-native-packages/node_modules/react-native.

I suppose that it could be solved by adding an option to provide a path to the custom metro.config.js when running run-ios and run-android commands.

Possible Implementations

I spent some time understanding the code base and find some possible implementations, but I struggle to find a place where Metro CLI actually gets called.

How I understand the process so far: runAndroid command runs launchPackager.command to start metro server. launchPackager.command calls react-native-community/cli run, and from here I can’t connect the dots how we run Metro CLI and start the server.

I’d be happy to submit a pr for this feature request if somebody could point me out the right place for introducing these changes 😄🤞

Related Issues

https://github.com/facebook/metro/issues/588 https://github.com/react-native-community/cli/pull/1358

[duailibe]

@grabbou I’m having a similar problem, I believe the problem is that launchPackager.command (and packager.sh) from react-native assumes the project root differently from the CLI. It assumes the root is the folder where react-native is installed and cd’s to it.

https://github.com/facebook/react-native/blob/e973b3afc274f892a0e5a6fdea9004dc5d84eb2b/scripts/packager.sh#L10-L23

My folder structure is:

~/Code/project/
    package.json
    node_modules/
        react-native/
    web/
        index.js
        package.json
    mobile/
        index.js
        metro.config.js
        package.json

And when I run both run-android and run-ios from the mobile/ folder, it runs:

❯ /Users/me/Code/project/node_modules/react-native/scripts/launchPackager.command

and it starts the bundler, but it fails to bundle with the following message:

Error: Unable to resolve module ./index from /Users/me/project/.: 

None of these files exist:
  * index(.native|.ios.js|.native.js|.js|.ios.json|.native.json|.json|.ios.ts|.native.ts|.ts|.ios.tsx|.native.tsx|.tsx)
  * index/index(.native|.ios.js|.native.js|.js|.ios.json|.native.json|.json|.ios.ts|.native.ts|.ts|.ios.tsx|.native.tsx|.tsx)

I don’t see how the launchPackager.command uses cwd in any way.

[github-actions[bot]]

There hasn’t been any activity on this issue in the past 3 months, so it has been marked as stale and it will be closed automatically if no further activity occurs in the next 7 days.