From b41a33ede99826aa6b100e5fb53b1a918a5b8bba Mon Sep 17 00:00:00 2001 From: Alex Hunt Date: Mon, 12 Feb 2024 05:20:38 -0800 Subject: [PATCH] Move metro-config package into monorepo build, enable TS generation (#41836) Summary: This adds `react-native/metro-config` to the monorepo build tool and emits the missing typescript declarations. Right now, we do have typescript declarations on `metro-config`, but not `react-native/metro-config`. Which makes everything a bit harder extend from "[the default React Native metro config](https://github.com/facebook/react-native/pull/36502)" in Expo. > Note, I also added the same `exports` block from `react-native/dev-middleware` for conformity. One open question here is, why aren't we exporting _all_ helper functions from `metro-config`? To me, its a bit weird that we need both `metro-config` _and_ `react-native/metro-config` as `loadConfig` isn't exported. ## Changelog: [INTERNAL] [FIXED] - Emit typescript declaration files for `react-native/metro-config` Pull Request resolved: https://github.com/facebook/react-native/pull/41836 Test Plan: Run the build tool, and check if the typescript declarations are emitted for `react-native/metro-config`. ``` yarn build metro-config ``` Reviewed By: hoxyq Differential Revision: D51943453 Pulled By: huntie fbshipit-source-id: cfaffe5660053fc9a9fcbe3dacf7f6ccc2bde01b --- packages/metro-config/.gitignore | 5 ++++ packages/metro-config/package.json | 8 +++++- .../{index.js => src/index.flow.js} | 27 +++++++++---------- packages/metro-config/src/index.js | 20 ++++++++++++++ scripts/build/config.js | 4 +++ 5 files changed, 48 insertions(+), 16 deletions(-) create mode 100644 packages/metro-config/.gitignore rename packages/metro-config/{index.js => src/index.flow.js} (82%) create mode 100644 packages/metro-config/src/index.js diff --git a/packages/metro-config/.gitignore b/packages/metro-config/.gitignore new file mode 100644 index 00000000000..40d93a0332c --- /dev/null +++ b/packages/metro-config/.gitignore @@ -0,0 +1,5 @@ +# Dependencies +/node_modules + +# Build output +/dist diff --git a/packages/metro-config/package.json b/packages/metro-config/package.json index 55016cb21ef..410f04a50b8 100644 --- a/packages/metro-config/package.json +++ b/packages/metro-config/package.json @@ -18,7 +18,13 @@ "engines": { "node": ">=18" }, - "exports": "./index.js", + "exports": { + ".": "./src/index.js", + "./package.json": "./package.json" + }, + "files": [ + "dist" + ], "dependencies": { "@react-native/js-polyfills": "0.74.0", "@react-native/metro-babel-transformer": "0.74.0", diff --git a/packages/metro-config/index.js b/packages/metro-config/src/index.flow.js similarity index 82% rename from packages/metro-config/index.js rename to packages/metro-config/src/index.flow.js index 2abf2c8757d..6aad1cb74da 100644 --- a/packages/metro-config/index.js +++ b/packages/metro-config/src/index.flow.js @@ -4,13 +4,14 @@ * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. * - * @flow - * @noformat + * @flow strict-local + * @format + * @oncall react_native */ -/*:: import type {ConfigT} from 'metro-config'; */ +import type {ConfigT} from 'metro-config'; -const {getDefaultConfig: getBaseConfig, mergeConfig} = require('metro-config'); +import {getDefaultConfig as getBaseConfig, mergeConfig} from 'metro-config'; const INTERNAL_CALLSITES_REGEX = new RegExp( [ @@ -36,12 +37,12 @@ const INTERNAL_CALLSITES_REGEX = new RegExp( ].join('|'), ); +export {mergeConfig} from 'metro-config'; + /** * Get the base Metro configuration for a React Native project. */ -function getDefaultConfig( - projectRoot /*: string */ -) /*: ConfigT */ { +export function getDefaultConfig(projectRoot: string): ConfigT { const config = { resolver: { resolverMainFields: ['react-native', 'browser', 'main'], @@ -53,15 +54,16 @@ function getDefaultConfig( getModulesRunBeforeMainModule: () => [ require.resolve('react-native/Libraries/Core/InitializeCore'), ], + // $FlowFixMe[untyped-import] getPolyfills: () => require('@react-native/js-polyfills')(), }, server: { port: Number(process.env.RCT_METRO_PORT) || 8081, }, symbolicator: { - customizeFrame: (frame /*: $ReadOnly<{file: ?string, ...}>*/) => { + customizeFrame: (frame: $ReadOnly<{file: ?string, ...}>) => { const collapse = Boolean( - frame.file && INTERNAL_CALLSITES_REGEX.test(frame.file), + frame.file != null && INTERNAL_CALLSITES_REGEX.test(frame.file), ); return {collapse}; }, @@ -88,10 +90,5 @@ function getDefaultConfig( // Set global hook so that the CLI can detect when this config has been loaded global.__REACT_NATIVE_METRO_CONFIG_LOADED = true; - return mergeConfig( - getBaseConfig.getDefaultValues(projectRoot), - config, - ); + return mergeConfig(getBaseConfig.getDefaultValues(projectRoot), config); } - -module.exports = {getDefaultConfig, mergeConfig}; diff --git a/packages/metro-config/src/index.js b/packages/metro-config/src/index.js new file mode 100644 index 00000000000..b1cd97b5d45 --- /dev/null +++ b/packages/metro-config/src/index.js @@ -0,0 +1,20 @@ +/** + * 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 + * @format + * @oncall react_native + */ + +/*:: +export type * from './index.flow'; +*/ + +if (!process.env.BUILD_EXCLUDE_BABEL_REGISTER) { + require('../../../scripts/build/babel-register').registerForMonorepo(); +} + +export * from './index.flow'; diff --git a/scripts/build/config.js b/scripts/build/config.js index a2014995b82..676fffb5c74 100644 --- a/scripts/build/config.js +++ b/scripts/build/config.js @@ -49,6 +49,10 @@ const buildConfig /*: BuildConfig */ = { target: 'node', emitTypeScriptDefs: true, }, + 'metro-config': { + target: 'node', + emitTypeScriptDefs: true, + }, }, };