Metro: projectRoot is ignored/dropped when running `react-native run-ios`

Created on 30 Oct 2020  路  1Comment  路  Source: facebook/metro

Do you want to request a feature or report a bug?
Report a 馃悰

What is the current behavior?
I am getting an error that metro couldn't find the entry file for my app with the error:

Error: Unable to resolve module './index' from ''

I did some logging in the metro Server and saw that the projectRoot from metro was different than what react-native cli got:

From react-native cli (react-native run-ios --verbose)

projectRoot: /Users/brandonroberts/workspace/calm/mobile

From metro window

projectRoot: /Users/brandonroberts/workspace/calm

This bug might be in the @react-native-community/cli project but I am opening here first because the logging shows the correct projectRoot from that command.

The resolver is looking up a level in the root of my monorepo instead of accepting the projectRoot that I specify (calm/mobile). I logged the entrypoint "candidates" in the server try/catch block to confirm that it is looking for the index.js file in the root instead of the mobile folder.

{
  file: {
    type: 'sourceFile',
    filePathPrefix: '/Users/brandonroberts/workspace/calm/index',
    candidateExts: [
      '.native',      '',
      '.ios.js',      '.native.js',
      '.js',          '.ios.json',
      '.native.json', '.json',
      '.ios.ts',      '.native.ts',
      '.ts',          '.ios.tsx',
      '.native.tsx',  '.tsx'
    ]
  },
  dir: {
    type: 'sourceFile',
    filePathPrefix: '/Users/brandonroberts/workspace/calm/index/index',
    candidateExts: [
      '.native',      '',
      '.ios.js',      '.native.js',
      '.js',          '.ios.json',
      '.native.json', '.json',
      '.ios.ts',      '.native.ts',
      '.ts',          '.ios.tsx',
      '.native.tsx',  '.tsx'
    ]
  }
}

If the current behavior is a bug, please provide the steps to reproduce and a minimal repository on GitHub that we can yarn install and yarn test.
This example isn't mine, but has the same issue: https://github.com/Brigad/monorepo-example

To repro, clone and run the following:

yarn && cd packages/mobileapp && npx pod-install && yarn ios

What is the expected behavior?
Metro would use the calm/mobile folder instead of looking in the wrong place for the index file. I think it might be useful to note that clearing the cache and running with react-native start --clear-cache will successfully use the correct project root.

Please provide your exact Metro configuration and mention your Metro, node, yarn/npm version and operating system.

metro: 0.58.0
node: 12.18.3
yarn: 1.21.1
OS: Mac 10.15.7

Most helpful comment

This is because of this line that's invoked by the "Launch Packager" XCode build step: https://github.com/facebook/react-native/blob/master/scripts/packager.sh#L11. The script will launch the packager from your mono-repo root instead of from within packages/mobileapp.

This line in react-native-xcode.sh has been changed recently to allow for us to define a $PROJECT_ROOT var as part of the "Bundle React Native code and images" step.

Unfortunately it looks like the packager.sh step doesn't have the same fallback behaviour.

If this is a missing functionality and not intentional, the fix would be to change from

PROJECT_ROOT="$THIS_DIR/../../.."

to

PROJECT_ROOT=${PROJECT_ROOT:-"$THIS_DIR/../../.."}

>All comments

This is because of this line that's invoked by the "Launch Packager" XCode build step: https://github.com/facebook/react-native/blob/master/scripts/packager.sh#L11. The script will launch the packager from your mono-repo root instead of from within packages/mobileapp.

This line in react-native-xcode.sh has been changed recently to allow for us to define a $PROJECT_ROOT var as part of the "Bundle React Native code and images" step.

Unfortunately it looks like the packager.sh step doesn't have the same fallback behaviour.

If this is a missing functionality and not intentional, the fix would be to change from

PROJECT_ROOT="$THIS_DIR/../../.."

to

PROJECT_ROOT=${PROJECT_ROOT:-"$THIS_DIR/../../.."}
Was this page helpful?
0 / 5 - 0 ratings