breaking: Update cli-plugin-metro to use defaults in app metro.config.js (RN 0.72) by huntie · Pull Request #1875 · react-native-community/cli

huntie · 2023-03-15T16:50:19Z

Context

React Native Metro config → React Native repo (react/react-native#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: react/react-native#36502

Changes

This PR updates React Native CLI so that the new config setup will work.

Removes all static config values and renames internal function to getOverrideConfig.
- This expects that under React Native 0.72's template (and upgrade guidance for users), apps have the newest metro.config.js (as located/explained in RFC: Add @react-native/metro-config package react/react-native#36502).
- getOverrideConfig specifically contains only dynamically defined config derived from input arguments to the CLI. We believe this is a clear enough separation to leave these in, but move all static config values into @react-native/metro-config.
Removes loadMetroConfig from the public API of cli-plugin-metro.

Changelog: [Breaking] Remove static Metro defaults from cli-plugin-metro, remove getDefaultConfig

Test plan

See RFC: Add @react-native/metro-config package react/react-native#36502.

Inside React Native repo using rn-tester:

✅ Local metro.config.js matching new template is loaded
✅ @react-native/metro-config config is extended
✅ These CLI changes are loaded
✅ App packages and runs

Rollout plan

This is a breaking change to RN CLI that will be incompatible with React Native < 0.72.

React Native 0.72 is being prepared, and will include a version bump to React Native CLI once the following react-native PRs are merged.

RFC: Add @react-native/metro-config package react/react-native#36502
[Incoming PR] Add @react-native/metro-config to template

huntie · 2023-03-16T16:04:09Z

Opening PR for feedback and am preparing E2E test scenarios.

huntie · 2023-03-16T18:59:51Z

Hmm, it's dawned on me that this could be done as a breaking change to RN CLI, and we can drop the version-checking logic. Rest of plan unchanged. Will update tomorrow.

huntie · 2023-03-17T15:36:03Z

PR is simplified, retitled, and ready for review. Note that I'm still validating E2E behaviour in the test plan of react/react-native#36502.

huntie · 2023-03-20T17:43:19Z

Test plan updated — this change is tested against all incoming changes in the RN repo (update: upstream is ready).

@adamTrz @thymikee Ready for review.

thymikee · 2023-03-21T19:31:10Z

- * Default configuration
+ * Get the config options to override based on RN CLI inputs.
 */
-export const getDefaultConfig = (ctx: ConfigLoadingContext): InputConfigT => {


Let's check if this is not used by Windows/macOS teams. cc @tido64 @Saadnajmi

I can't find any references to this function in react-native-windows/-macos. Nor do we use it in rnx-kit. I'd say it's safe to remove it, but I'll let @Saadnajmi verify as well.

@tido While this particular function isn't used, the answer is yes, this overall PR breaks RNW. :) All of our PRs are blocked because we test changes by creating a new app with the CLI and verifying it builds/bundles.
See: microsoft/react-native-windows#11437
We currently have a (hopefully temporary) workaround here: microsoft/react-native-windows#11438

It should've been fixed in: #1889. Is this still happening as in 11.0.1?

thymikee

It's happening 🚀

….js (RN 0.72)

huntie · 2023-03-22T13:26:50Z

Feedback addressed. Ready to merge once fully confirmed by @tido64 / @Saadnajmi :).

Saadnajmi · 2023-03-22T15:22:14Z

Feedback addressed. Ready to merge once fully confirmed by @tido64 / @Saadnajmi :).

Why are you tagging me? I'm not a maintainer.

tido64

Feedback addressed. Ready to merge once fully confirmed by @tido64 / @Saadnajmi :).
Why are you tagging me? I'm not a maintainer.

I think @huntie wants you to verify this: #1875 (comment)

Anyway, I don't think we should delay this any further.

Saadnajmi · 2023-03-23T12:02:33Z

Feedback addressed. Ready to merge once fully confirmed by @tido64 / @Saadnajmi :).
Why are you tagging me? I'm not a maintainer.
I think @huntie wants you to verify this: #1875 (comment)
Anyway, I don't think we should delay this any further.

Yeah just go for it.

Summary: Pull Request resolved: #36623 Changelog: [General][Changed] - The default `metro.config.js` in apps now extends `react-native/metro-config`, and should be updated in existing apps. ~~`react-native/rn-get-polyfills.js` is removed and should be updated to `react-native/js-polyfills` in existing apps (this is part of the new default config).~~ #publish-packages-to-npm ## Context ### React Native Metro config → React Native repo (#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 (which previewed the CLI bump) here: #36502 ## Changes NOTE: This PR is pending the inclusion of a bump to `react-native-community/cli`, and will be sequenced after react-native-community/cli#1875 is merged. - Upgrade `react-native-community/cli` to `11.0.0`, upgrade all `metro` packages to `0.76.0` (version distributed in this CLI release). - Update the `metro.config.js` file in `packages/react-native/template/`. - Now merges defaults from `react-native/metro-config`, and can be used with CLI >= 11.0.0. - Update the `metro.config.js` files for `packages/react-native/` and `packages/rn-tester/` (these are integration test locations). - Now merges defaults from `react-native/metro-config`, and can be used with CLI >= 11.0.0. Changes to `react-native/metro-config` — `0.72.1` (prepared but not depended on yet): - Export `mergeConfig` util (removing direct `metro-config` dependency in consuming projects). - Explicitly depend on `metro-react-native-babel-transformer` and `metro-runtime` (transitively included today). Reviewed By: cortinico, blakef Differential Revision: D44099691 fbshipit-source-id: 405635dd69fd50a1e9548279eaeda3c932b5b167

Summary: Pull Request resolved: react/react-native#36623 Changelog: [General][Changed] - The default `metro.config.js` in apps now extends `react-native/metro-config`, and should be updated in existing apps. ~~`react-native/rn-get-polyfills.js` is removed and should be updated to `react-native/js-polyfills` in existing apps (this is part of the new default config).~~ #publish-packages-to-npm ## Context ### React Native Metro config → React Native repo (react/react-native#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 (which previewed the CLI bump) here: react/react-native#36502 ## Changes NOTE: This PR is pending the inclusion of a bump to `react-native-community/cli`, and will be sequenced after react-native-community/cli#1875 is merged. - Upgrade `react-native-community/cli` to `11.0.0`, upgrade all `metro` packages to `0.76.0` (version distributed in this CLI release). - Update the `metro.config.js` file in `packages/react-native/template/`. - Now merges defaults from `react-native/metro-config`, and can be used with CLI >= 11.0.0. - Update the `metro.config.js` files for `packages/react-native/` and `packages/rn-tester/` (these are integration test locations). - Now merges defaults from `react-native/metro-config`, and can be used with CLI >= 11.0.0. Changes to `react-native/metro-config` — `0.72.1` (prepared but not depended on yet): - Export `mergeConfig` util (removing direct `metro-config` dependency in consuming projects). - Explicitly depend on `metro-react-native-babel-transformer` and `metro-runtime` (transitively included today). Reviewed By: cortinico, blakef Differential Revision: D44099691 fbshipit-source-id: 405635dd69fd50a1e9548279eaeda3c932b5b167 Original: react/react-native@c5a47ab

Summary: Pull Request resolved: react/react-native#36623 Changelog: [General][Changed] - The default `metro.config.js` in apps now extends `react-native/metro-config`, and should be updated in existing apps. ~~`react-native/rn-get-polyfills.js` is removed and should be updated to `react-native/js-polyfills` in existing apps (this is part of the new default config).~~ #publish-packages-to-npm ## Context ### React Native Metro config → React Native repo (react/react-native#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 (which previewed the CLI bump) here: react/react-native#36502 ## Changes NOTE: This PR is pending the inclusion of a bump to `react-native-community/cli`, and will be sequenced after react-native-community/cli#1875 is merged. - Upgrade `react-native-community/cli` to `11.0.0`, upgrade all `metro` packages to `0.76.0` (version distributed in this CLI release). - Update the `metro.config.js` file in `packages/react-native/template/`. - Now merges defaults from `react-native/metro-config`, and can be used with CLI >= 11.0.0. - Update the `metro.config.js` files for `packages/react-native/` and `packages/rn-tester/` (these are integration test locations). - Now merges defaults from `react-native/metro-config`, and can be used with CLI >= 11.0.0. Changes to `react-native/metro-config` — `0.72.1` (prepared but not depended on yet): - Export `mergeConfig` util (removing direct `metro-config` dependency in consuming projects). - Explicitly depend on `metro-react-native-babel-transformer` and `metro-runtime` (transitively included today). Reviewed By: cortinico, blakef Differential Revision: D44099691 fbshipit-source-id: 405635dd69fd50a1e9548279eaeda3c932b5b167 Original-Commit: react/react-native@c5a47ab

huntie changed the title ~~rn metro config stack 1~~[RFC] feat: Update cli-plugin-metro to use defaults in app metro.config.js from RN 0.72Mar 15, 2023

huntie force-pushed the rn-metro-config-stack-1 branch 6 times, most recently from 598f1a0 to c53e49bCompare March 16, 2023 13:56

huntie marked this pull request as ready for review March 16, 2023 16:04

huntie requested review from adamTrz and thymikee as code owners March 16, 2023 16:04

huntie mentioned this pull request Mar 16, 2023
RFC: Add @react-native/metro-config package react/react-native#36502
Closed

huntie force-pushed the rn-metro-config-stack-1 branch from c53e49b to eab2533Compare March 17, 2023 15:27

huntie changed the title ~~[RFC] feat: Update cli-plugin-metro to use defaults in app metro.config.js from RN 0.72~~breaking: Update cli-plugin-metro to use defaults in app metro.config.js (RN 0.72)Mar 17, 2023

thymikee reviewed Mar 21, 2023
View reviewed changes

Comment threadpackages/cli-plugin-metro/src/tools/loadMetroConfig.ts

thymikee reviewed Mar 21, 2023
View reviewed changes

thymikee approved these changes Mar 21, 2023
View reviewed changes

breaking: Update cli-plugin-metro to use defaults in app metro.config…
47278fd
….js (RN 0.72)

huntie force-pushed the rn-metro-config-stack-1 branch from eab2533 to 47278fdCompare March 22, 2023 11:29

tido64 approved these changes Mar 23, 2023
View reviewed changes

Saadnajmi approved these changes Mar 23, 2023
View reviewed changes

thymikee merged commit 7867612 into react-native-community:mainMar 23, 2023

huntie mentioned this pull request Mar 24, 2023
Bump RN CLI, add @react-native/metro-config to template react/react-native#36623
Closed

huntie deleted the rn-metro-config-stack-1 branch March 27, 2023 10:31

This was referenced Mar 27, 2023
fix: Add runtime error when Metro config cannot be resolved #1889
Merged
fix: Pin exact versions of RN CLI dependencies #1893
Merged

jonthysell mentioned this pull request Mar 30, 2023
Bundling fails for new apps built against main with missing-asset-registry-path error microsoft/react-native-windows#11437
Closed

huntie mentioned this pull request Mar 31, 2023
fix: Fix merge of CLI Metro config overrides, add soft fallback to RN defaults #1896
Merged

acoates-ms mentioned this pull request Jun 15, 2023
Update needed for RN 0.72 microsoft/rnx-kit#2466
Closed
5 tasks

Uh oh!

Conversation

huntie commented Mar 15, 2023• edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Context

React Native Metro config → React Native repo (react/react-native#36502)

Changes

Test plan

Rollout plan

Uh oh!

huntie commented Mar 16, 2023

Uh oh!

huntie commented Mar 16, 2023

Uh oh!

huntie commented Mar 17, 2023

Uh oh!

huntie commented Mar 20, 2023• edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Uh oh!

thymikeeMar 21, 2023

Choose a reason for hiding this comment

Uh oh!

tido64Mar 22, 2023

Choose a reason for hiding this comment

Uh oh!

jonthysellMar 30, 2023• edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

tido64Mar 31, 2023

Choose a reason for hiding this comment

Uh oh!

thymikee left a comment

Choose a reason for hiding this comment

Uh oh!

huntie commented Mar 22, 2023• edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Saadnajmi commented Mar 22, 2023

Uh oh!

tido64 left a comment

Choose a reason for hiding this comment

Uh oh!

Saadnajmi commented Mar 23, 2023

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

5 participants

huntie commented Mar 15, 2023•
edited
Loading

huntie commented Mar 20, 2023•
edited
Loading

jonthysellMar 30, 2023•
edited
Loading

huntie commented Mar 22, 2023•
edited
Loading