From ab3ea8bd431f5325e392f53b7021948df068adfb Mon Sep 17 00:00:00 2001
From: Alex Hunt <alexeh@meta.com>
Date: Mon, 20 Mar 2023 05:06:01 -0700
Subject: [PATCH] Add @react-native/metro-config package (#36502)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Summary:
Changelog:
[General][Added] - Add `react-native/metro-config` package

Pull Request resolved: https://github.com/facebook/react-native/pull/36502

## Context

### React Native Metro config → React Native repo (https://github.com/facebook/react-native/pull/36502)

We (the React Native team) are aiming to relocate the default Metro config for React Native out of `react-native-community/cli-plugin-metro` and **into the React Native repo + app template** as a new `react-native/metro-config` package.

This is the first (and minimum viable) phase we can ship to separate the release process of Metro from RN CLI in order to reduce coupling and iterate faster for our users.

**See full motivation, design, and test plan here: https://github.com/facebook/react-native/pull/36502**

## Changes

- This PR adds the new `react-native/metro-config` package, reproduces all static values previously defined in RN CLI. The values which remain in RN CLI are dynamic values derived from CLI options passed by the user.

{F906910591}

Reviewed By: cortinico

Differential Revision: D44099692

fbshipit-source-id: 399bfb21b49200e7d53c9d358c64607f4091847d
---
 packages/metro-config/index.js     | 86 ++++++++++++++++++++++++++++++
 packages/metro-config/package.json | 16 ++++++
 2 files changed, 102 insertions(+)
 create mode 100644 packages/metro-config/index.js
 create mode 100644 packages/metro-config/package.json

diff --git a/packages/metro-config/index.js b/packages/metro-config/index.js
new file mode 100644
index 00000000000000..07a16e217c3d2b
--- /dev/null
+++ b/packages/metro-config/index.js
@@ -0,0 +1,86 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @flow
+ * @noformat
+ */
+
+/*:: import type {ConfigT} from 'metro-config'; */
+
+const {getDefaultConfig: getBaseConfig, mergeConfig} = require('metro-config');
+
+const INTERNAL_CALLSITES_REGEX = new RegExp(
+  [
+    '/Libraries/Renderer/implementations/.+\\.js$',
+    '/Libraries/BatchedBridge/MessageQueue\\.js$',
+    '/Libraries/YellowBox/.+\\.js$',
+    '/Libraries/LogBox/.+\\.js$',
+    '/Libraries/Core/Timers/.+\\.js$',
+    '/Libraries/WebSocket/.+\\.js$',
+    '/Libraries/vendor/.+\\.js$',
+    '/node_modules/react-devtools-core/.+\\.js$',
+    '/node_modules/react-refresh/.+\\.js$',
+    '/node_modules/scheduler/.+\\.js$',
+    '/node_modules/event-target-shim/.+\\.js$',
+    '/node_modules/invariant/.+\\.js$',
+    '/node_modules/react-native/index.js$',
+    '/metro-runtime/.+\\.js$',
+    '^\\[native code\\]$',
+  ].join('|'),
+);
+
+/**
+ * Get the base Metro configuration for a React Native project.
+ */
+function getDefaultConfig(
+  projectRoot /*: string */
+) /*: ConfigT */ {
+  const config = {
+    resolver: {
+      resolverMainFields: ['react-native', 'browser', 'main'],
+      platforms: ['android', 'ios'],
+      unstable_conditionNames: ['import', 'require', 'react-native'],
+    },
+    serializer: {
+      getPolyfills: () => require('@react-native/js-polyfills')(),
+    },
+    server: {
+      port: Number(process.env.RCT_METRO_PORT) || 8081,
+    },
+    symbolicator: {
+      customizeFrame: (frame /*: $ReadOnly<{file: ?string, ...}>*/) => {
+        const collapse = Boolean(
+          frame.file && INTERNAL_CALLSITES_REGEX.test(frame.file),
+        );
+        return {collapse};
+      },
+    },
+    transformer: {
+      allowOptionalDependencies: true,
+      assetRegistryPath: 'react-native/Libraries/Image/AssetRegistry',
+      asyncRequireModulePath: require.resolve(
+        'metro-runtime/src/modules/asyncRequire',
+      ),
+      babelTransformerPath: require.resolve(
+        'metro-react-native-babel-transformer',
+      ),
+      getTransformOptions: async () => ({
+        transform: {
+          experimentalImportSupport: false,
+          inlineRequires: true,
+        },
+      }),
+    },
+    watchFolders: [],
+  };
+
+  return mergeConfig(
+    getBaseConfig.getDefaultValues(projectRoot),
+    config,
+  );
+}
+
+module.exports = {getDefaultConfig};
diff --git a/packages/metro-config/package.json b/packages/metro-config/package.json
new file mode 100644
index 00000000000000..a10bad657d4b78
--- /dev/null
+++ b/packages/metro-config/package.json
@@ -0,0 +1,16 @@
+{
+  "name": "@react-native/metro-config",
+  "version": "0.72.0",
+  "description": "Metro configuration for React Native.",
+  "repository": {
+    "type": "git",
+    "url": "git@github.com:facebook/react-native.git",
+    "directory": "packages/metro-config"
+  },
+  "license": "MIT",
+  "exports": "./index.js",
+  "dependencies": {
+    "@react-native/js-polyfills": "^0.72.1",
+    "metro-config": "0.75.1"
+  }
+}