fix metro configs for examples

Author: jonthysell

example/metro.config.js

@@ -1,13 +1,14 @@
-const {getDefaultConfig, mergeConfig} = require('@react-native/metro-config');
+const MetroConfig = require('@rnx-kit/metro-config');
 
 const fs = require('fs');
 const path = require('path');
-const exclusionList = require('metro-config/src/defaults/exclusionList');
 
 const rnwPath = fs.realpathSync(
   path.resolve(require.resolve('react-native-windows/package.json'), '..'),
 );
 
+//
+
 /**
  * Metro configuration
  * https://facebook.github.io/metro/docs/configuration
@@ -16,22 +17,19 @@ const rnwPath = fs.realpathSync(
  */
 
 const config = {
+  //
   resolver: {
-    blockList: exclusionList([
-      // This stops "react-native run-windows" from causing the metro server to crash if its already running
+    blockList: MetroConfig.exclusionList([
+      // This stops "npx @react-native-community/cli run-windows" from causing the metro server to crash if its already running
       new RegExp(
         `${path.resolve(__dirname, 'windows').replace(/[/\\]/g, '/')}.*`,
       ),
-      // This prevents "react-native run-windows" from hitting: EBUSY: resource busy or locked, open msbuild.ProjectImports.zip or other files produced by msbuild
+      // This prevents "npx @react-native-community/cli run-windows" from hitting: EBUSY: resource busy or locked, open msbuild.ProjectImports.zip or other files produced by msbuild
       new RegExp(`${rnwPath}/build/.*`),
       new RegExp(`${rnwPath}/target/.*`),
       /.*\.ProjectImports\.zip/,
     ]),
-    extraNodeModules: {
-      'react-native-xaml': fs.realpathSync(
-        path.dirname(require.resolve('react-native-xaml/package.json')),
-      ),
-    },
+    //
   },
   transformer: {
     getTransformOptions: async () => ({
@@ -40,9 +38,8 @@ const config = {
         inlineRequires: true,
       },
     }),
-    // This fixes the 'missing-asset-registry-path` error (see https://github.com/microsoft/react-native-windows/issues/11437)
-    assetRegistryPath: 'react-native/Libraries/Image/AssetRegistry',
   },
+  projectRoot: __dirname,
 };
 
-module.exports = mergeConfig(getDefaultConfig(__dirname), config);
+module.exports = MetroConfig.makeMetroConfig(config);

example/package.json

@@ -25,6 +25,7 @@
     "@react-native/eslint-config": "0.77.0",
     "@react-native/metro-config": "0.77.0",
     "@react-native/typescript-config": "0.77.0",
+    "@rnx-kit/metro-config": "^1.3.5",
     "@types/jest": "^29.5.13",
     "@types/react": "^18.2.6",
     "@types/react-test-renderer": "^18.0.0",

examplenuget/metro.config.js

@@ -1,8 +1,7 @@
-const {getDefaultConfig, mergeConfig} = require('@react-native/metro-config');
+const MetroConfig = require('@rnx-kit/metro-config');
 
 const fs = require('fs');
 const path = require('path');
-const exclusionList = require('metro-config/src/defaults/exclusionList');
 
 const rnwPath = fs.realpathSync(
   path.resolve(require.resolve('react-native-windows/package.json'), '..'),
@@ -20,7 +19,7 @@ const rnwPath = fs.realpathSync(
 const config = {
   //
   resolver: {
-    blockList: exclusionList([
+    blockList: MetroConfig.exclusionList([
       // This stops "npx @react-native-community/cli run-windows" from causing the metro server to crash if its already running
       new RegExp(
         `${path.resolve(__dirname, 'windows').replace(/[/\\]/g, '/')}.*`,
@@ -40,6 +39,7 @@ const config = {
       },
     }),
   },
+  projectRoot: __dirname,
 };
 
-module.exports = mergeConfig(getDefaultConfig(__dirname), config);
+module.exports = MetroConfig.makeMetroConfig(config);

examplenuget/package.json

@@ -25,6 +25,7 @@
     "@react-native/eslint-config": "0.77.0",
     "@react-native/metro-config": "0.77.0",
     "@react-native/typescript-config": "0.77.0",
+    "@rnx-kit/metro-config": "^1.3.5",
     "@types/jest": "^29.5.13",
     "@types/react": "^18.2.6",
     "@types/react-test-renderer": "^18.0.0",

yarn.lock

@@ -2434,6 +2434,37 @@
     invariant "^2.2.4"
     nullthrows "^1.1.1"
 
+"@rnx-kit/metro-config@^1.3.5":
+  version "1.3.17"
+  resolved "https://registry.yarnpkg.com/@rnx-kit/metro-config/-/metro-config-1.3.17.tgz#8efc69151161e0ce76b6966d3fc9de284a189391"
+  integrity sha512-OAQhevPAYkRcFtGHv8Fxl9P0rQhc3slcclmHHIsV6IYanqeIl8uW/djmLY27MBLu+uvjNCirc7XJ9sH9mUYuRQ==
+  dependencies:
+    "@rnx-kit/tools-node" "^2.0.0"
+    "@rnx-kit/tools-react-native" "^1.4.1"
+    "@rnx-kit/tools-workspaces" "^0.1.3"
+
+"@rnx-kit/tools-node@^2.0.0", "@rnx-kit/tools-node@^2.0.1":
+  version "2.1.2"
+  resolved "https://registry.yarnpkg.com/@rnx-kit/tools-node/-/tools-node-2.1.2.tgz#8f854b0136beadfc8b8a6c2c8f5f0f0cfefadfc4"
+  integrity sha512-pCpiUpC/032ZoN4iFZFWtKp3Vrjma115nXwv2gyD2XFxj6DFyTX6pYjSK70xT7gwLMU0C3bZonN1JxiOBlGb0A==
+
+"@rnx-kit/tools-react-native@^1.4.1":
+  version "1.4.2"
+  resolved "https://registry.yarnpkg.com/@rnx-kit/tools-react-native/-/tools-react-native-1.4.2.tgz#099972ecb705276d17fea72da5531f24271fe3a7"
+  integrity sha512-dzXMvJdOXWl6hyAem8TceinWIH5zEjCSj0lvtHx09fIPbFu9IjiFT6X8xBBmAOXixzu4FLJw1c41N78a2Q/yCg==
+  dependencies:
+    "@rnx-kit/tools-node" "^2.0.1"
+
+"@rnx-kit/tools-workspaces@^0.1.3":
+  version "0.1.6"
+  resolved "https://registry.yarnpkg.com/@rnx-kit/tools-workspaces/-/tools-workspaces-0.1.6.tgz#94e5fb72c9857cf4a00d27e931b7ca5a362b4695"
+  integrity sha512-af5CYnc1dtnMIAl2u0U1QHUCGgLNN9ZQkYCAtQOHPxxgF5yX2Cr9jrXLZ9M+/h/eSVbK0ETjJWbNbPoiUSW/7w==
+  dependencies:
+    fast-glob "^3.2.7"
+    find-up "^5.0.0"
+    read-yaml-file "^2.1.0"
+    strip-json-comments "^3.1.1"
+
 "@sideway/address@^4.1.0":
   version "4.1.2"
   resolved "https://registry.npmjs.org/@sideway/address/-/address-4.1.2.tgz"
@@ -4118,27 +4149,27 @@ fast-deep-equal@^3.1.1, fast-deep-equal@^3.1.3:
   resolved "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz"
   integrity sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==
 
-fast-glob@^3.2.9:
-  version "3.2.12"
-  resolved "https://registry.npmjs.org/fast-glob/-/fast-glob-3.2.12.tgz"
-  integrity sha512-DVj4CQIYYow0BlaelwK1pHl5n5cRSJfM60UA0zK891sVInoPri2Ekj7+e1CT3/3qxXenpI+nBBmQAcJPJgaj4w==
+fast-glob@^3.2.7, fast-glob@^3.3.2:
+  version "3.3.3"
+  resolved "https://registry.yarnpkg.com/fast-glob/-/fast-glob-3.3.3.tgz#d06d585ce8dba90a16b0505c543c3ccfb3aeb818"
+  integrity sha512-7MptL8U0cqcFdzIzwOTHoilX9x5BrNqye7Z/LuC7kCMRio1EMSyqRK3BEAUD7sXRq4iT4AzTVuZdhgQ2TCvYLg==
   dependencies:
     "@nodelib/fs.stat" "^2.0.2"
     "@nodelib/fs.walk" "^1.2.3"
     glob-parent "^5.1.2"
     merge2 "^1.3.0"
-    micromatch "^4.0.4"
+    micromatch "^4.0.8"
 
-fast-glob@^3.3.2:
-  version "3.3.3"
-  resolved "https://registry.yarnpkg.com/fast-glob/-/fast-glob-3.3.3.tgz#d06d585ce8dba90a16b0505c543c3ccfb3aeb818"
-  integrity sha512-7MptL8U0cqcFdzIzwOTHoilX9x5BrNqye7Z/LuC7kCMRio1EMSyqRK3BEAUD7sXRq4iT4AzTVuZdhgQ2TCvYLg==
+fast-glob@^3.2.9:
+  version "3.2.12"
+  resolved "https://registry.npmjs.org/fast-glob/-/fast-glob-3.2.12.tgz"
+  integrity sha512-DVj4CQIYYow0BlaelwK1pHl5n5cRSJfM60UA0zK891sVInoPri2Ekj7+e1CT3/3qxXenpI+nBBmQAcJPJgaj4w==
   dependencies:
     "@nodelib/fs.stat" "^2.0.2"
     "@nodelib/fs.walk" "^1.2.3"
     glob-parent "^5.1.2"
     merge2 "^1.3.0"
-    micromatch "^4.0.8"
+    micromatch "^4.0.4"
 
 fast-json-stable-stringify@^2.0.0, fast-json-stable-stringify@^2.1.0:
   version "2.1.0"
@@ -5346,7 +5377,7 @@ js-yaml@^3.13.1:
     argparse "^1.0.7"
     esprima "^4.0.0"
 
-js-yaml@^4.1.0:
+js-yaml@^4.0.0, js-yaml@^4.1.0:
   version "4.1.0"
   resolved "https://registry.npmjs.org/js-yaml/-/js-yaml-4.1.0.tgz"
   integrity sha512-wpxZs9NoxZaJESJGIZTyDEaYpl0FKSA+FB9aJiyemKhMwkxQg63h4T1KJgUGHpTqPDNRcmmYLugrRjJlBtWvRA==
@@ -6648,6 +6679,14 @@ react@18.3.1:
   dependencies:
     loose-envify "^1.1.0"
 
+read-yaml-file@^2.1.0:
+  version "2.1.0"
+  resolved "https://registry.yarnpkg.com/read-yaml-file/-/read-yaml-file-2.1.0.tgz#c5866712db9ef5343b4d02c2413bada53c41c4a9"
+  integrity sha512-UkRNRIwnhG+y7hpqnycCL/xbTk7+ia9VuVTC0S+zVbwd65DI9eUpRMfsWIGrCWxTU/mi+JW8cHQCrv+zfCbEPQ==
+  dependencies:
+    js-yaml "^4.0.0"
+    strip-bom "^4.0.0"
+
 readable-stream@^3.4.0:
   version "3.6.0"
   resolved "https://registry.npmjs.org/readable-stream/-/readable-stream-3.6.0.tgz"