Something is trying to use the devDependency 'metro-config' when building a production release build

[Voxar]

Environment

info Fetching system and libraries information...
(node:11799) [DEP0040] DeprecationWarning: The punycode module is deprecated. Please use a userland alternative instead.
(Use node --trace-deprecation ... to show where the warning was created)
System:
OS: macOS 14.3.1
CPU: (8) arm64 Apple M1 Pro
Memory: 327.63 MB / 32.00 GB
Shell:
version: 3.6.1
path: /opt/homebrew/bin/fish
Binaries:
Node:
version: 21.7.3
path: /opt/homebrew/bin/node
Yarn:
version: 1.22.22
path: /opt/homebrew/bin/yarn
npm:
version: 10.5.2
path: /opt/homebrew/bin/npm
Watchman:
version: 2024.04.15.00
path: /opt/homebrew/bin/watchman
Managers:
CocoaPods:
version: 1.15.2
path: /opt/homebrew/bin/pod
SDKs:
iOS SDK:
Platforms:
- DriverKit 23.2
- iOS 17.2
- macOS 14.2
- tvOS 17.2
- visionOS 1.0
- watchOS 10.2
Android SDK: Not Found
IDEs:
Android Studio: 2021.2 AI-212.5712.43.2112.8815526
Xcode:
version: 15.2/15C500b
path: /usr/bin/xcodebuild
Languages:
Java:
version: 11.0.16.1
path: /Library/Java/JavaVirtualMachines/microsoft-11.jdk/Contents/Home/bin/javac
Ruby:
version: 3.3.0
path: /opt/homebrew/bin/ruby
npmPackages:
"@react-native-community/cli": Not Found
react: Not Found
react-native: Not Found
react-native-macos: Not Found
npmGlobalPackages:
"react-native": Not Found
Android:
hermesEnabled: true
newArchEnabled: false
iOS:
hermesEnabled: true
newArchEnabled: false

Description

Something is trying to use the devDependency 'metro-config' when building a production release build. I did not find relevant open issues.

+ /opt/homebrew/bin/node /Users/voxar/projects/AwesomeProject/node_modules/react-native/cli.js bundle --entry-file index.js --platform ios --dev false --reset-cache --bundle-output /Users/voxar/Library/Developer/Xcode/DerivedData/AwesomeProject-aohpaqzpsscvpicbmnzrzycupwsx/Build/Products/Release-iphoneos/main.jsbundle --assets-dest /Users/voxar/Library/Developer/Xcode/DerivedData/AwesomeProject-aohpaqzpsscvpicbmnzrzycupwsx/Build/Products/Release-iphoneos/AwesomeProject.app --minify false
(node:18816) [DEP0040] DeprecationWarning: The `punycode` module is deprecated. Please use a userland alternative instead.
(Use `node --trace-deprecation ...` to show where the warning was created)
error Cannot find module '@react-native/metro-config'
Require stack:
- /Users/voxar/projects/AwesomeProject/metro.config.js
- /Users/voxar/projects/AwesomeProject/node_modules/cosmiconfig/node_modules/import-fresh/index.js
- /Users/voxar/projects/AwesomeProject/node_modules/cosmiconfig/dist/loaders.js
- /Users/voxar/projects/AwesomeProject/node_modules/cosmiconfig/dist/createExplorer.js
- /Users/voxar/projects/AwesomeProject/node_modules/cosmiconfig/dist/index.js
- /Users/voxar/projects/AwesomeProject/node_modules/@react-native-community/cli-config/build/readConfigFromDisk.js
- /Users/voxar/projects/AwesomeProject/node_modules/@react-native-community/cli-config/build/loadConfig.js
- /Users/voxar/projects/AwesomeProject/node_modules/@react-native-community/cli-config/build/index.js
- /Users/voxar/projects/AwesomeProject/node_modules/@react-native-community/cli/build/commands/index.js
- /Users/voxar/projects/AwesomeProject/node_modules/@react-native-community/cli/build/index.js
- /Users/voxar/projects/AwesomeProject/node_modules/react-native/cli.js.
Error: Cannot find module '@react-native/metro-config'
Require stack:
- /Users/voxar/projects/AwesomeProject/metro.config.js
- /Users/voxar/projects/AwesomeProject/node_modules/cosmiconfig/node_modules/import-fresh/index.js
- /Users/voxar/projects/AwesomeProject/node_modules/cosmiconfig/dist/loaders.js
- /Users/voxar/projects/AwesomeProject/node_modules/cosmiconfig/dist/createExplorer.js
- /Users/voxar/projects/AwesomeProject/node_modules/cosmiconfig/dist/index.js
- /Users/voxar/projects/AwesomeProject/node_modules/@react-native-community/cli-config/build/readConfigFromDisk.js
- /Users/voxar/projects/AwesomeProject/node_modules/@react-native-community/cli-config/build/loadConfig.js
- /Users/voxar/projects/AwesomeProject/node_modules/@react-native-community/cli-config/build/index.js
- /Users/voxar/projects/AwesomeProject/node_modules/@react-native-community/cli/build/commands/index.js
- /Users/voxar/projects/AwesomeProject/node_modules/@react-native-community/cli/build/index.js
- /Users/voxar/projects/AwesomeProject/node_modules/react-native/cli.js
    at Module._resolveFilename (node:internal/modules/cjs/loader:1142:15)
    at Module._load (node:internal/modules/cjs/loader:983:27)
    at Module.require (node:internal/modules/cjs/loader:1230:19)
    at require (node:internal/modules/helpers:179:18)
    at Object.<anonymous> (/Users/voxar/projects/AwesomeProject/metro.config.js:1:41)
    at Module._compile (node:internal/modules/cjs/loader:1368:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1426:10)
    at Module.load (node:internal/modules/cjs/loader:1205:32)
    at Module._load (node:internal/modules/cjs/loader:1021:12)
    at Module.require (node:internal/modules/cjs/loader:1230:19)

Reproducible Demo

npx react-native@latest init AwesomeProject
cd AwesomeProject
yarn --production
cd ios
bundle
bundle exec pod install

• Open project in Xcode
• Edit scheme and switch Build Configuration to "Release"
• Build

[szymonrybczak]

May I ask why do you pass --production flag to when installing packages? Without passing this flag, everything works correctly.

[Voxar]

@szymonrybczak without it you also get the devDependencies which you would not want to include in a production build.

[robhogan]

1. You'll need the dev dependencies to build. Build tools (like Metro) themselves are typically dev dependencies.
2. That's fine, because Metro will only bundle files in use by your project (it crawls import and require from your entry point) - it doesn't just bundle everything.

[Voxar]

Oh, I thought Metro was just a dev server.

So there's not really any point in separating packages betwen "dependencies" and "devDepencendies" then, other than semantics?

What is NODE_ENV=production / yarn --production for?