Ensure InitializeCore is run before app code (#4814)

* Ensure InitializeCore is run before app code

* Change files

Author: acoates-ms

change/@office-iss-react-native-win32-2020-05-06-14-34-01-fixfast.json

@@ -0,0 +1,8 @@
+{
+  "type": "prerelease",
+  "comment": "Ensure InitializeCore is run before app code",
+  "packageName": "@office-iss/react-native-win32",
+  "email": "[email protected]",
+  "dependentChangeType": "patch",
+  "date": "2020-05-06T21:33:58.938Z"
+}

change/react-native-windows-2020-05-06-14-34-01-fixfast.json

@@ -0,0 +1,8 @@
+{
+  "type": "prerelease",
+  "comment": "Ensure InitializeCore is run before app code",
+  "packageName": "react-native-windows",
+  "email": "[email protected]",
+  "dependentChangeType": "patch",
+  "date": "2020-05-06T21:34:00.993Z"
+}

packages/E2ETest/metro.config.js

@@ -6,6 +6,10 @@
  */
 const path = require('path');
 const blacklist = require('metro-config/src/defaults/blacklist');
+const {
+  getModulesRunBeforeMainModule,
+  reactNativePlatformResolver,
+} = require('react-native-windows/metro-react-native-platform');
 
 const rnwPath = path.resolve(__dirname, '../../vnext');
 
@@ -19,9 +23,9 @@ module.exports = {
   ],
 
   resolver: {
-    resolveRequest: require('react-native-windows/metro-react-native-platform').reactNativePlatformResolver(
-      { windows: 'react-native-windows' }
-    ),
+    resolveRequest: 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-windows': rnwPath,
@@ -34,6 +38,9 @@ module.exports = {
       ),
     ]),
   },
+  serializer: {
+    getModulesRunBeforeMainModule,
+  },
   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

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

@@ -6,6 +6,10 @@
  */
 const path = require('path');
 const blacklist = require('metro-config/src/defaults/blacklist');
+const {
+  getModulesRunBeforeMainModule,
+  reactNativePlatformResolver,
+} = require('react-native-windows/metro-react-native-platform');
 
 const rnwPath = path.resolve(__dirname, '../../vnext');
 
@@ -19,9 +23,9 @@ module.exports = {
   ],
 
   resolver: {
-    resolveRequest: require('react-native-windows/metro-react-native-platform').reactNativePlatformResolver(
-      {windows: 'react-native-windows'},
-    ),
+    resolveRequest: 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-windows': rnwPath,
@@ -36,6 +40,9 @@ module.exports = {
       ),
     ]),
   },
+  serializer: {
+    getModulesRunBeforeMainModule,
+  },
   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

packages/playground/metro.config.js

@@ -7,6 +7,10 @@
 const fs = require('fs');
 const path = require('path');
 const blacklist = require('metro-config/src/defaults/blacklist');
+const {
+  getModulesRunBeforeMainModule,
+  reactNativePlatformResolver,
+} = require('react-native-windows/metro-react-native-platform');
 
 const rnwPath = fs.realpathSync(
   path.resolve(require.resolve('react-native-windows/package.json'), '..'),
@@ -22,9 +26,9 @@ module.exports = {
   ],
 
   resolver: {
-    resolveRequest: require('react-native-windows/metro-react-native-platform').reactNativePlatformResolver(
-      {windows: 'react-native-windows'},
-    ),
+    resolveRequest: reactNativePlatformResolver({
+      windows: 'react-native-windows',
+    }),
     extraNodeModules: {
       // Redirect react-native-windows to avoid symlink (metro doesn't like symlinks)
       'react-native-windows': rnwPath,
@@ -36,6 +40,9 @@ module.exports = {
       ),
     ]),
   },
+  serializer: {
+    getModulesRunBeforeMainModule,
+  },
   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

packages/react-native-win32/metro-react-native-platform.js

@@ -38,4 +38,49 @@ function reactNativePlatformResolver(platformImplementations) {
   };
 }
 
-module.exports = {reactNativePlatformResolver};
+/**
+ * The CLI will get a more complete implementation of this in https://github.com/react-native-community/cli/pull/1115
+ * but until then, use a solution that supports having react-native-win32 and/or react-native-windows and/or react-native-macos
+ */
+const getModulesRunBeforeMainModule = () => {
+  const options = {
+    paths: [process.cwd()],
+  };
+  const modules = [
+    require.resolve('react-native/Libraries/Core/InitializeCore', options),
+  ];
+
+  try {
+    modules.push(
+      require.resolve(
+        '@office-iss/react-native-win32/Libraries/Core/InitializeCore',
+        options,
+      ),
+    );
+  } catch {}
+
+  try {
+    modules.push(
+      require.resolve(
+        'react-native-windows/Libraries/Core/InitializeCore',
+        options,
+      ),
+    );
+  } catch {}
+
+  try {
+    modules.push(
+      require.resolve(
+        'react-native-macos/Libraries/Core/InitializeCore',
+        options,
+      ),
+    );
+  } catch {}
+
+  return modules;
+};
+
+module.exports = {
+  getModulesRunBeforeMainModule,
+  reactNativePlatformResolver,
+};

packages/react-native-win32/metro.config.js

@@ -3,6 +3,10 @@
  */
 const fs = require('fs');
 const path = require('path');
+const {
+  getModulesRunBeforeMainModule,
+  reactNativePlatformResolver,
+} = require('./metro-react-native-platform');
 
 module.exports = {
   // WatchFolders is only needed due to the yarn workspace layout of node_modules, we need to watch the symlinked locations separately
@@ -12,9 +16,12 @@ module.exports = {
   ],
 
   resolver: {
-    resolveRequest: require('./metro-react-native-platform').reactNativePlatformResolver(
-      {win32: '@office-iss/react-native-win32'},
-    ),
+    resolveRequest: reactNativePlatformResolver({
+      win32: '@office-iss/react-native-win32',
+    }),
+  },
+  serializer: {
+    getModulesRunBeforeMainModule,
   },
   transformer: {
     // The cli defaults this to a full path to react-native, which bypasses the reactNativePlatformResolver above

vnext/local-cli/generator-windows/templates/metro.config.js

@@ -7,11 +7,16 @@
 const path = require('path');
 const blacklist = require('metro-config/src/defaults/blacklist');
 
+const {
+  getModulesRunBeforeMainModule,
+  reactNativePlatformResolver,
+} = require('react-native-windows/metro-react-native-platform');
+
 module.exports = {
   resolver: {
-    resolveRequest: require('react-native-windows/metro-react-native-platform').reactNativePlatformResolver(
-      {windows: 'react-native-windows'},
-    ),
+    resolveRequest: reactNativePlatformResolver({
+      windows: 'react-native-windows',
+    }),
     blacklistRE: blacklist([
       // This stops "react-native run-windows" from causing the metro server to crash if its already running
       new RegExp(
@@ -25,6 +30,9 @@ module.exports = {
       ),
     ]),
   },
+  serializer: {
+    getModulesRunBeforeMainModule,
+  },
   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

vnext/metro-react-native-platform.js

@@ -38,4 +38,40 @@ function reactNativePlatformResolver(platformImplementations) {
   };
 }
 
-module.exports = {reactNativePlatformResolver};
+/**
+ * The CLI will get a more complete implementation of this in https://github.com/react-native-community/cli/pull/1115
+ * but until then, use a solution that supports having react-native-windows and/or react-native-macos
+ */
+const getModulesRunBeforeMainModule = () => {
+  const options = {
+    paths: [process.cwd()],
+  };
+  const modules = [
+    require.resolve('react-native/Libraries/Core/InitializeCore', options),
+  ];
+
+  try {
+    modules.push(
+      require.resolve(
+        'react-native-windows/Libraries/Core/InitializeCore',
+        options,
+      ),
+    );
+  } catch {}
+
+  try {
+    modules.push(
+      require.resolve(
+        'react-native-macos/Libraries/Core/InitializeCore',
+        options,
+      ),
+    );
+  } catch {}
+
+  return modules;
+};
+
+module.exports = {
+  getModulesRunBeforeMainModule,
+  reactNativePlatformResolver,
+};

vnext/metro.config.js

@@ -3,7 +3,11 @@
  */
 const fs = require('fs');
 const path = require('path');
-const blacklist = require('metro-config/src/defaults/blacklist');
+
+const {
+  getModulesRunBeforeMainModule,
+  reactNativePlatformResolver,
+} = require('react-native-windows/metro-react-native-platform');
 
 const rnwPath = __dirname;
 
@@ -15,17 +19,20 @@ module.exports = {
   ],
 
   resolver: {
-    resolveRequest: require('./metro-react-native-platform').reactNativePlatformResolver(
-      {
-        windesktop: 'react-native-windows',
-        windows: 'react-native-windows',
-      },
-    ),
+    resolveRequest: reactNativePlatformResolver({
+      windesktop: 'react-native-windows',
+      windows: 'react-native-windows',
+    }),
     extraNodeModules: {
       // Redirect react-native-windows to this folder
       'react-native-windows': rnwPath,
     },
   },
+
+  serializer: {
+    getModulesRunBeforeMainModule,
+  },
+
   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