This is an alternate metro bundler fix for multiple out of tree platforms

.ado/templates/e2e-test-job.yml

@@ -34,7 +34,7 @@ jobs:
       - task: CmdLine@2
         displayName: run-windows
         inputs:
-          script: react-native run-windows --no-packager --arch ${{ parameters.BuildPlatform }} --release --logging --msbuildprops BaseIntDir=$(BaseIntDir)
+          script: yarn windows --no-packager --arch ${{ parameters.BuildPlatform }} --release --logging --msbuildprops BaseIntDir=$(BaseIntDir)
           workingDirectory: packages/E2ETest
 
       - task: PublishBuildArtifacts@1

.ado/templates/react-native-init.yml

@@ -143,5 +143,5 @@ steps:
   - task: CmdLine@2
     displayName: Create bundle testcli
     inputs:
-      script: react-native bundle --entry-file index.js platform windows --bundle-output test.bundle
+      script: npx --no-install react-native bundle --entry-file index.js --platform windows --bundle-output test.bundle
       workingDirectory: $(Agent.BuildDirectory)\testcli

.ado/windows-vs-pr.yml

@@ -259,21 +259,21 @@ jobs:
       - task: CmdLine@2
         displayName: run-windows (Debug)
         inputs:
-          script: react-native run-windows --no-packager --no-launch --no-deploy --arch $(BuildPlatform) --logging --msbuildprops BaseIntDir=$(BaseIntDir)
+          script: yarn windows --no-packager --no-launch --no-deploy --arch $(BuildPlatform) --logging --msbuildprops BaseIntDir=$(BaseIntDir)
           workingDirectory: packages/microsoft-reactnative-sampleapps
         condition: and(succeeded(), eq(variables['BuildConfiguration'], 'Debug'))
 
       - task: CmdLine@2
         displayName: run-windows (Release)
         inputs:
-          script: react-native run-windows --no-packager --no-launch --no-deploy --arch $(BuildPlatform) --logging --release --msbuildprops BaseIntDir=$(BaseIntDir)
+          script: yarn windows --no-packager --no-launch --no-deploy --arch $(BuildPlatform) --logging --release --msbuildprops BaseIntDir=$(BaseIntDir)
           workingDirectory: packages/microsoft-reactnative-sampleapps
         condition: and(succeeded(), eq(variables['BuildConfiguration'], 'Release'))
 
       - task: CmdLine@2
         displayName: Create SampleApp bundle
         inputs:
-          script: node node_modules/react-native/local-cli/cli.js bundle --entry-file index.windows.js --bundle-output SampleApp.bundle
+          script: yarn bundle-cpp
           workingDirectory: packages\microsoft-reactnative-sampleapps
         condition: succeeded()
 

change/@office-iss-react-native-win32-2020-04-11-18-14-13-altmetrofix.json

@@ -0,0 +1,8 @@
+{
+  "type": "prerelease",
+  "comment": "Use a custom resolver wrapper to allow metro to run for multiple platforms at once",
+  "packageName": "@office-iss/react-native-win32",
+  "email": "[email protected]",
+  "dependentChangeType": "patch",
+  "date": "2020-04-12T01:14:10.605Z"
+}

change/react-native-windows-2020-04-11-18-14-13-altmetrofix.json

@@ -0,0 +1,8 @@
+{
+  "type": "prerelease",
+  "comment": "Use a custom resolver wrapper to allow metro to run for multiple platforms at once",
+  "packageName": "react-native-windows",
+  "email": "[email protected]",
+  "dependentChangeType": "patch",
+  "date": "2020-04-12T01:14:13.308Z"
+}

packages/E2ETest/metro.config.js

@@ -4,13 +4,9 @@
  *
  * @format
  */
-const fs = require('fs');
 const path = require('path');
 const blacklist = require('metro-config/src/defaults/blacklist');
 
-const rnPath = fs.realpathSync(
-  path.resolve(require.resolve('react-native/package.json'), '..')
-);
 const rnwPath = path.resolve(__dirname, '../../vnext');
 
 module.exports = {
@@ -23,42 +19,25 @@ module.exports = {
   ],
 
   resolver: {
+    resolveRequest: require('react-native-windows/metro-react-native-platform').reactNativePlatformResolver(
+      { windows: 'react-native-windows' }
+    ),
     extraNodeModules: {
       // Redirect metro to rnwPath instead of node_modules/react-native-windows, since metro doesn't like symlinks
-      'react-native': rnwPath,
       'react-native-windows': rnwPath,
     },
-    // Include the macos platform in addition to the defaults because the fork includes macos, but doesn't declare it
-    platforms: ['ios', 'android', 'windesktop', 'windows', 'web', 'macos'],
-    // Since there are multiple copies of react-native, we need to ensure that metro only sees one of them
-    // This should go away after RN 0.60 when haste is removed
     blacklistRE: blacklist([
       new RegExp('.*E2ETest/msbuild.*'.replace(/[/\\]/g, '\\/')), // Avoid error EBUSY: resource busy or locked, open 'D:\a\1\s\packages\E2ETest\msbuild.ProjectImports.zip' in pipeline
-      new RegExp(`${path.resolve(rnPath)}.*`.replace(/[/\\]/g, '/')),
-      new RegExp(
-        `${path.resolve(rnwPath, 'ReactCopies').replace(/[/\\]/g, '/')}.*`
-      ),
-      new RegExp(
-        `${path
-          .resolve(rnwPath, 'node_modules/react-native')
-          .replace(/[/\\]/g, '/')}.*`
-      ),
-      new RegExp(
-        `${path
-          .resolve(
-            require.resolve('@react-native-community/cli/package.json'),
-            '../node_modules/react-native'
-          )
-          .replace(/[/\\]/g, '/')}.*`
-      ),
-
       // This stops "react-native run-windows" from causing the metro server to crash if its already running
       new RegExp(
         `${path.resolve(__dirname, 'windows').replace(/[/\\]/g, '/')}.*`
       ),
     ]),
   },
   transformer: {
+    // The cli defaults this to a full path to react-native, which bypasses the reactNativePlatformResolver above
+    // Hopefully we can fix the default in the future
+    assetRegistryPath: 'react-native/Libraries/Image/AssetRegistry',
     getTransformOptions: async () => ({
       transform: {
         experimentalImportSupport: false,

packages/E2ETest/package.json

@@ -5,11 +5,11 @@
   "scripts": {
     "build": "just-scripts build",
     "clean": "just-scripts clean",
-    "postinstall": "node postinstall.js",
     "start": "react-native start",
     "lint": "just-scripts lint",
     "lint:fix": "just-scripts lint:fix",
     "watch": "tsc -w",
+    "windows": "react-native run-windows",
     "prettier": "prettier --write --loglevel warn \"**/**/*.ts\"",
     "e2e": "react-native run-windows --no-launch --logging && npm run e2etest",
     "e2ebundle": "npm run bundle && react-native run-windows --no-launch --no-packager --bundle --logging && npm run e2etest",

packages/microsoft-reactnative-sampleapps/metro.config.js

@@ -4,13 +4,9 @@
  *
  * @format
  */
-const fs = require('fs');
 const path = require('path');
 const blacklist = require('metro-config/src/defaults/blacklist');
 
-const rnPath = fs.realpathSync(
-  path.resolve(require.resolve('react-native/package.json'), '..'),
-);
 const rnwPath = path.resolve(__dirname, '../../vnext');
 
 module.exports = {
@@ -23,44 +19,27 @@ module.exports = {
   ],
 
   resolver: {
+    resolveRequest: require('react-native-windows/metro-react-native-platform').reactNativePlatformResolver(
+      {windows: 'react-native-windows'},
+    ),
     extraNodeModules: {
       // Redirect metro to rnwPath instead of node_modules/react-native-windows, since metro doesn't like symlinks
-      'react-native': rnwPath,
       'react-native-windows': rnwPath,
     },
-    // Include the macos platform in addition to the defaults because the fork includes macos, but doesn't declare it
-    platforms: ['ios', 'android', 'windesktop', 'windows', 'web', 'macos'],
-    // Since there are multiple copies of react-native, we need to ensure that metro only sees one of them
-    // This should go away after RN 0.60 when haste is removed
     blacklistRE: blacklist([
       new RegExp(
         '.*microsoft-reactnative-sampleapps/msbuild.*'.replace(/[/\\]/g, '\\/'),
       ), // Avoid error EBUSY: resource busy or locked, open 'D:\a\1\s\packages\E2ETest\msbuild.ProjectImports.zip' in pipeline
-      new RegExp(`${path.resolve(rnPath)}.*`.replace(/[/\\]/g, '/')),
-      new RegExp(
-        `${path.resolve(rnwPath, 'ReactCopies').replace(/[/\\]/g, '/')}.*`,
-      ),
-      new RegExp(
-        `${path
-          .resolve(rnwPath, 'node_modules/react-native')
-          .replace(/[/\\]/g, '/')}.*`,
-      ),
-      new RegExp(
-        `${path
-          .resolve(
-            require.resolve('@react-native-community/cli/package.json'),
-            '../node_modules/react-native',
-          )
-          .replace(/[/\\]/g, '/')}.*`,
-      ),
-
       // This stops "react-native run-windows" from causing the metro server to crash if its already running
       new RegExp(
         `${path.resolve(__dirname, 'windows').replace(/[/\\]/g, '/')}.*`,
       ),
     ]),
   },
   transformer: {
+    // The cli defaults this to a full path to react-native, which bypasses the reactNativePlatformResolver above
+    // Hopefully we can fix the default in the future
+    assetRegistryPath: 'react-native/Libraries/Image/AssetRegistry',
     getTransformOptions: async () => ({
       transform: {
         experimentalImportSupport: false,

packages/microsoft-reactnative-sampleapps/package.json

@@ -7,11 +7,11 @@
     "bundle-cpp": "just-scripts prepareBundle && react-native bundle --platform windows --entry-file index.windows.js --bundle-output windows/SampleAppCpp/Bundle/index.windows.bundle --assets-dest windows/SampleAppCpp/Bundle",
     "bundle-cs": "just-scripts prepareBundle && react-native bundle --platform windows --entry-file index.windows.js --bundle-output windows/SampleAppCS/Bundle/index.windows.bundle --assets-dest windows/SampleAppCS/Bundle",
     "clean": "just-scripts clean",
-    "postinstall": "node postinstall.js",
     "start": "react-native start",
     "lint": "just-scripts lint",
     "lint:fix": "just-scripts lint:fix",
-    "watch": "tsc -w"
+    "watch": "tsc -w",
+    "windows": "react-native run-windows"
   },
   "dependencies": {
     "react": "16.9.0",
@@ -28,4 +28,4 @@
     "metro-react-native-babel-preset": "^0.56.0",
     "react-test-renderer": "16.9.0"
   }
-}
+}

packages/playground/metro.config.js

@@ -8,9 +8,6 @@ const fs = require('fs');
 const path = require('path');
 const blacklist = require('metro-config/src/defaults/blacklist');
 
-const rnPath = fs.realpathSync(
-  path.resolve(require.resolve('react-native/package.json'), '..'),
-);
 const rnwPath = fs.realpathSync(
   path.resolve(require.resolve('react-native-windows/package.json'), '..'),
 );
@@ -25,27 +22,24 @@ module.exports = {
   ],
 
   resolver: {
+    resolveRequest: require('react-native-windows/metro-react-native-platform').reactNativePlatformResolver(
+      {windows: 'react-native-windows'},
+    ),
     extraNodeModules: {
-      // Redirect react-native to react-native-windows
-      'react-native': rnwPath,
+      // Redirect react-native-windows to avoid symlink (metro doesn't like symlinks)
       'react-native-windows': rnwPath,
     },
-    // Include the macos platform in addition to the defaults because the fork includes macos, but doesn't declare it
-    platforms: ['ios', 'android', 'windesktop', 'windows', 'web', 'macos'],
-    // Since there are multiple copies of react-native, we need to ensure that metro only sees one of them
-    // This should go in RN 0.61 when haste is removed
     blacklistRE: blacklist([
-      new RegExp(
-        `${(path.resolve(rnPath) + path.sep).replace(/[/\\]/g, '/')}.*`,
-      ),
-
       // This stops "react-native run-windows" from causing the metro server to crash if its already running
       new RegExp(
         `${path.resolve(__dirname, 'windows').replace(/[/\\]/g, '/')}.*`,
       ),
     ]),
   },
   transformer: {
+    // The cli defaults this to a full path to react-native, which bypasses the reactNativePlatformResolver above
+    // Hopefully we can fix the default in the future
+    assetRegistryPath: 'react-native/Libraries/Image/AssetRegistry',
     getTransformOptions: async () => ({
       transform: {
         experimentalImportSupport: false,