Bundling fails for new apps built against main with missing-asset-registry-path error

[jonthysell]

Problem Description

When bundling a (release) bundle, the command fails with the following error:

Error: Unable to resolve module missing-asset-registry-path from C:\code\testcli\node_modules\react-native-windows\Libraries\NewAppScreen\components\logo.png: missing-asset-registry-path could not be found within the project or in these directories:
  node_modules\react-native-windows\node_modules
  node_modules

This is reproable by either building the bundle manually with react-native bundle or by letting react-native run-windows --release build the bundle.

This is currently blocking all of our PRs from passing the checks where we create and test new CLI apps.

Steps To Reproduce

1. New RN app:
   npx --yes react-native@0.0.0-20230308-2111-d41e95fb1 init testcli --template react-native@0.0.0-20230308-2111-d41e95fb1
2. Add RNW canary:
   npx --yes react-native-windows-init@latest --verbose --version 0.0.0-canary.634 --overwrite --language cpp --projectType app
3. Try to bundle:
   yarn react-native bundle --platform windows --entry-file "index.js" --bundle-output "C:\code\testcli\windows\testcli\Bundle\index.windows.bundle" --assets-dest "C:\code\testcli\windows\testcli\Bundle" --dev false --reset-cache --sourcemap-output "C:\code\testcli\windows\x64\Release\testcli\sourcemaps\react\index.windows.bundle.map"

Expected Results

Bundle building succeeds

CLI version

11.0.0-alpha.2

Environment

System:
    OS: Windows 10 10.0.25324
    CPU: (8) x64 Intel(R) Core(TM) i7-8650U CPU @ 1.90GHz
    Memory: 1.02 GB / 15.84 GB
  Binaries:
    Node: 16.18.1 - C:\Program Files\nodejs\node.EXE
    Yarn: 1.22.19 - C:\Program Files (x86)\Yarn\bin\yarn.CMD
    npm: 8.19.2 - C:\Program Files\nodejs\npm.CMD
    Watchman: Not Found
  SDKs:
    Android SDK: Not Found
    Windows SDK:
      AllowDevelopmentWithoutDevLicense: Enabled
      AllowAllTrustedApps: Enabled
      Versions: 10.0.16299.0, 10.0.18362.0, 10.0.19041.0, 10.0.22000.0, 10.0.22621.0
  IDEs:
    Android Studio: Not Found
    Visual Studio: 16.11.33423.256 (Visual Studio Enterprise 2019), 17.5.33516.290 (Visual Studio Enterprise 2022)
  Languages:
    Java: Not Found
    Ruby: Not Found
  npmPackages:
    @react-native-community/cli: Not Found
    react: 18.2.0 => 18.2.0
    react-native: 0.0.0-20230308-2111-d41e95fb1 => 0.0.0-20230308-2111-d41e95fb1
    react-native-windows: * => 0.0.0-canary.634
  npmGlobalPackages:
    *react-native*: Not Found

Target Platform Version

10.0.19041

Target Device(s)

Desktop

Visual Studio Version

Visual Studio 2022

Build Configuration

ReleaseBundle

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

No response

[jonthysell]

This may be an upstream regression as within our repo bundling works fine, but even formerly passing PR builds now fail even without any dependency changes on our end.

[jonthysell]

Current suspect is the new version of Metro 0.76 which calls out breaking changes in asset resolution: https://github.com/facebook/metro/releases/tag/v0.76.0

[jonthysell]

It looks like this might be the upstream breaking change: react-native-community/cli#1875

[huntie]

Hi @jonthysell! Yes this was caused by the above change, which comes in with @react-native-community/cli-plugin-metro@11.0.0 (and previous 11.x alphas when installed without a lockfile). Also broke the React Native RC branch (and main) for a bit as we don't use a lockfile in our project template.

Some references in case they help you:

• Original design for all changes: RFC: Add @react-native/metro-config package facebook/react-native#36502
• Hotfix we landed to lock dependencies at lower versions: Hotfix: Lock RN CLI to 11.0.0-alpha.0 in template facebook/react-native#36631
• Related fix because we were starting RN CLI in an incorrect dir: Fixed script for Packager.sh in RNTester facebook/react-native#36582
• (Future mitigation we've instated in RN CLI to prevent unexpected internal version bumps in future: fix: Pin exact versions of RN CLI dependencies react-native-community/cli#1893)

With the new CLI version included, the design is per facebook/react-native#36502 — requires a complete metro.config.js that extends @react-native/metro-config to be read.

• The final forward change: Bump RN CLI, add @react-native/metro-config to template facebook/react-native#36623

Please DM me on Twitter or RN Discord if I can help out.