Skip to content

@react-native/metro-config doesn't export default assetExts and sourceExts anymore. #38069

Closed
@gvarandas

Description

@gvarandas

Description

While upgrading to 0.72.0, we've noticed that the default config exported by @react-native/metro-config doesn't contain default values for the assetExts and sourceExts options, making it harder to extend those values in case projects need to perform any custom configuration.

A common use-case for extending these configs would be to better support svg files to be transpiled as React components (think of react-native-svg).

const { resolver: {sourceExts, assetExts} } = await getDefaultConfig();
// ...
resolver: {
  assetExts: assetExts.filter(ext => ext !== 'svg'),
  sourceExts: [...sourceExts, 'svg', 'cjs', 'mjs'],
},

It seems like this regression was caused due to dropping merging the original Metro config with the RN one (on this commit).

Is this a legit regression or do we expect projects to tap into metro-config directly to read those default values (maybe via loadConfig)?

Happy to provide a PR fixing the issue if it's flagged as a unintended behaviour.

React Native Version

0.72.0

Output of npx react-native info

  OS: macOS 13.4
  CPU: (8) arm64 Apple M1 Pro
  Memory: 115.80 MB / 16.00 GB
  Shell:
    version: "5.9"
    path: /bin/zsh
Binaries:
  Node:
    version: 20.3.1
    path: /opt/homebrew/bin/node
  Yarn:
    version: 1.22.19
    path: /opt/homebrew/bin/yarn
  npm:
    version: 9.6.7
    path: /opt/homebrew/bin/npm
  Watchman:
    version: 2023.06.12.00
    path: /opt/homebrew/bin/watchman
Managers:
  CocoaPods:
    version: 1.11.3
    path: /Users/gvarandas/.gem/ruby/3.1.2/bin/pod
SDKs:
  iOS SDK:
    Platforms:
      - DriverKit 22.4
      - iOS 16.4
      - macOS 13.3
      - tvOS 16.4
      - watchOS 9.4
  Android SDK:
    API Levels:
      - "24"
      - "25"
      - "26"
      - "28"
      - "29"
      - "30"
      - "31"
      - "32"
      - "33"
    Build Tools:
      - 29.0.2
      - 30.0.2
      - 30.0.3
      - 31.0.0
    System Images:
      - android-29 | Google APIs ARM 64 v8a
      - android-29 | Google APIs Intel x86 Atom
      - android-29 | Google APIs Intel x86 Atom_64
      - android-31 | Google APIs ARM 64 v8a
      - android-31 | Google APIs Intel x86_64 Atom
      - android-31 | Google Play ARM 64 v8a
      - android-33 | Google APIs ARM 64 v8a
    Android NDK: Not Found
IDEs:
  Android Studio: 2022.1 AI-221.6008.13.2211.9619390
  Xcode:
    version: 14.3/14E222b
    path: /usr/bin/xcodebuild
Languages:
  Java:
    version: 11.0.15
    path: /usr/bin/javac
  Ruby:
    version: 3.1.2
    path: /opt/rubies/3.1.2/bin/ruby
npmPackages:
  "@react-native-community/cli": Not Found
  react:
    installed: 18.2.0
    wanted: 18.2.0
  react-native:
    installed: 0.72.0
    wanted: 0.72.0
  react-native-macos: Not Found
npmGlobalPackages:
  "*react-native*": Not Found
Android:
  hermesEnabled: true
  newArchEnabled: false
iOS:
  hermesEnabled: true
  newArchEnabled: false

Steps to reproduce

  • Install 0.72.0
  • Install all dependencies (yarn, npm i, etc)
  • Check that the output from getDefaultConfig (@react-native/metro-config) doesn't produce the following structure anymore:
resolver: {
  assetExts: [ /* values */],
  sourceExts [ /* values */],
},

Snack, code example, screenshot, or link to a repository

Any new project is capable of checking for this issue.
The code present in the Upgrade Helper would reproduce the issue consistently.

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions