Add shared monorepo build setup #38240

huntie · 2023-07-07T15:38:12Z

Summary:

Context

RFC: Decoupling Flipper from React Native core: react-native-community/discussions-and-proposals#641

Changes

To support incoming new React Native packages around debugging (including migrating over @react-native-community/cli-plugin-metro) — which target Node.js and require a build step, this PR adds a minimal shared build setup across the react-native monorepo.

The setup is closely inspired/based on the build scripts in Jest, Metro, and React Native CLI — and is a simple set of script wrappers around Babel and Chokidar. These are available as build commands at the root of the repo:

yarn build
yarn clean
yarn watch

Build configuration (i.e. Babel config) is shared as a set standard across the monorepo, and packages are opted-in to requiring a build, configured in scripts/build.config.js.

const buildConfig /*: BuildConfig */ = {
  // The packages to include for build and their build options
  packages: {
    'dev-middleware': {target: 'node'},
  },
};

For now, there is a single target: 'node' option — this is necessary as react-native, unlike the above other projects, is a repository with packages targeting several runtimes. We may, in future, introduce a build step for other, non-Node, packages — which may be useful for things such as auto-generated TypeScript definitions.

Current integration points

.circleci/config.yml — Added to run_yarn (with project install).
Root yarn start — Convenience for local developers.
yarn start within packages/rn-tester — Convenience for local developers.

Planned: I will be adding notes on yarn build to the following "Contributing" website pages:

This is not load bearing quite yet: There are not yet any built packages added to the dependencies of packages/react-native/, so this will be further tested in a later PR (internally stacked as the next change).

Alternative designs

Per-package config file

Replace scripts/build/config.js with a package-defined key in in package.json, similar to Jest's publishConfig.

"buildConfig": {
  "type": "node"
},

This would be the only customisation required, with a single Babel config still standardised. Another option this might receive in future is enableTypeScriptCodgeen.

Rollup

More sophisticated build tool for Node.js, used by the React codebase (albeit within a custom script setup as well).

Lerna and Nx

Most sophisticated setup enabling caching and optimised cloud runs.
Probably the most likely thing we'll move towards at a later stage.

Changelog: [Internal]

Differential Revision: D46759508

facebook-github-bot · 2023-07-07T15:39:05Z

This pull request was exported from Phabricator. Differential Revision: D46759508

github-actions · 2023-07-07T15:39:34Z

	Warnings
⚠️	🔒 package.json - Changes were made to package.json. This will require a manual import by a Facebook employee.

Generated by 🚫 dangerJS against 87edd0e

analysis-bot · 2023-07-07T16:03:59Z

Platform	Engine	Arch	Size (bytes)	Diff
android	hermes	arm64-v8a	8,836,447	+4
android	hermes	armeabi-v7a	8,146,331	+0
android	hermes	x86	9,341,813	+0
android	hermes	x86_64	9,184,550	+2
android	jsc	arm64-v8a	9,448,262	+3
android	jsc	armeabi-v7a	8,630,015	+0
android	jsc	x86	9,530,933	+0
android	jsc	x86_64	9,774,146	+1

Base commit: 0cdb9e6
Branch: main

facebook-github-bot · 2023-07-07T16:41:27Z

This pull request was exported from Phabricator. Differential Revision: D46759508

Pranav-yadav · 2023-07-08T14:23:28Z

packages/dev-middleware/package.json

-  "scripts": {
-    "build": "yarn clean && babel src --out-dir dist",
-    "dev": "babel src --out-dir dist --source-maps --watch",
-    "clean": "rimraf dist",
-    "prepare": "yarn build"
-  },


are we going to publish this package? If yes, how do we want to provide these scripts and devDeps. to consumer. Context: There's no "private": true field...

Yes this package will be published (and depended on in upcoming changes). These scripts are now managed at the repo level.

Good to know. 👍

Summary: Pull Request resolved: facebook#38240 ## Context RFC: Decoupling Flipper from React Native core: react-native-community/discussions-and-proposals#641 ## Changes To support incoming new React Native packages around debugging (including migrating over [`react-native-community/cli-plugin-metro`](https://github.com/react-native-community/cli/tree/main/packages/cli-plugin-metro)) — which target Node.js and require a build step, this PR adds a minimal shared build setup across the `react-native` monorepo. The setup is closely inspired/based on the build scripts in Jest, Metro, and React Native CLI — and is a simple set of script wrappers around Babel and Chokidar. These are available as build commands at the root of the repo: - `yarn build` - `yarn clean` - `yarn watch` Build configuration (i.e. Babel config) is shared as a set standard across the monorepo, and **packages are opted-in to requiring a build**, configured in `scripts/build.config.js`. ``` const buildConfig /*: BuildConfig */ = { // The packages to include for build and their build options packages: { 'dev-middleware': {target: 'node'}, }, }; ``` For now, there is a single `target: 'node'` option — this is necessary as `react-native`, unlike the above other projects, is a repository with packages targeting several runtimes. We may, in future, introduce a build step for other, non-Node, packages — which may be useful for things such as auto-generated TypeScript definitions. {F1043312771} ## Current integration points - `.circleci/config.yml` — Added to `run_yarn` (with project install). - Root `yarn start` — Convenience for local developers. - `yarn start` within `packages/rn-tester` — Convenience for local developers. **Planned**: I will be adding notes on `yarn build` to the following "Contributing" website pages: - https://reactnative.dev/contributing/overview#contributing-code - https://reactnative.dev/contributing/how-to-open-a-pull-request#chapter-ii-implementing-your-changes **This is not load bearing quite yet**: There are not yet any built packages added to the dependencies of `packages/react-native/`, so this will be further tested in a later PR. ### Alternative designs **Per-package config file** Replace `scripts/build/config.js` with a package-defined key in in `package.json`, similar to Jest's [`publishConfig`](https://github.com/jestjs/jest/blob/1f019afdcdfc54a6664908bb45f343db4e3d0848/packages/jest-cli/package.json#L87C3-L89C4). ``` "buildConfig": { "type": "node" }, ``` This would be the only customisation required, with a single Babel config still standardised. Another option this might receive in future is `enableTypeScriptCodgeen`. **Rollup** More sophisticated build tool for Node.js, used by the React codebase (albeit within a custom script setup as well). **Lerna and Nx** - Most sophisticated setup enabling caching and optimised cloud runs. - Probably the most likely thing we'll move towards at a later stage. Changelog: [Internal] Differential Revision: D46759508 fbshipit-source-id: 80f0b59d13bdd42b1b857816e7329ac01f597ee6

Summary: Pull Request resolved: facebook#38240 ## Context RFC: Decoupling Flipper from React Native core: react-native-community/discussions-and-proposals#641 ## Changes To support incoming new React Native packages around debugging (including migrating over [`react-native-community/cli-plugin-metro`](https://github.com/react-native-community/cli/tree/main/packages/cli-plugin-metro)) — which target Node.js and require a build step, this PR adds a minimal shared build setup across the `react-native` monorepo. The setup is closely inspired/based on the build scripts in Jest, Metro, and React Native CLI — and is a simple set of script wrappers around Babel and Chokidar. These are available as build commands at the root of the repo: - `yarn build` - `yarn clean` - `yarn watch` Build configuration (i.e. Babel config) is shared as a set standard across the monorepo, and **packages are opted-in to requiring a build**, configured in `scripts/build.config.js`. ``` const buildConfig /*: BuildConfig */ = { // The packages to include for build and their build options packages: { 'dev-middleware': {target: 'node'}, }, }; ``` For now, there is a single `target: 'node'` option — this is necessary as `react-native`, unlike the above other projects, is a repository with packages targeting several runtimes. We may, in future, introduce a build step for other, non-Node, packages — which may be useful for things such as auto-generated TypeScript definitions. {F1043312771} ## Current integration points - `.circleci/config.yml` — Added to `run_yarn` (with project install). - Root `yarn start` — Convenience for local developers. - `yarn start` within `packages/rn-tester` — Convenience for local developers. **Planned**: I will be adding notes on `yarn build` to the following "Contributing" website pages: - https://reactnative.dev/contributing/overview#contributing-code - https://reactnative.dev/contributing/how-to-open-a-pull-request#chapter-ii-implementing-your-changes **This is not load bearing quite yet**: There are not yet any built packages added to the dependencies of `packages/react-native/`, so this will be further tested in a later PR. ### Alternative designs **Per-package config file** Replace `scripts/build/config.js` with a package-defined key in in `package.json`, similar to Jest's [`publishConfig`](https://github.com/jestjs/jest/blob/1f019afdcdfc54a6664908bb45f343db4e3d0848/packages/jest-cli/package.json#L87C3-L89C4). ``` "buildConfig": { "type": "node" }, ``` This would be the only customisation required, with a single Babel config still standardised. Another option this might receive in future is `enableTypeScriptCodgeen`. **Rollup** More sophisticated build tool for Node.js, used by the React codebase (albeit within a custom script setup as well). **Lerna and Nx** - Most sophisticated setup enabling caching and optimised cloud runs. - Probably the most likely thing we'll move towards at a later stage. Changelog: [Internal] Differential Revision: D46759508 fbshipit-source-id: 16ce03a7135f461b1e7e7df91369d07c794fc61c

Summary: Pull Request resolved: facebook#38240 ## Context RFC: Decoupling Flipper from React Native core: react-native-community/discussions-and-proposals#641 ## Changes To support incoming new React Native packages around debugging (including migrating over [`react-native-community/cli-plugin-metro`](https://github.com/react-native-community/cli/tree/main/packages/cli-plugin-metro)) — which target Node.js and require a build step, this PR adds a minimal shared build setup across the `react-native` monorepo. The setup is closely inspired/based on the build scripts in Jest, Metro, and React Native CLI — and is a simple set of script wrappers around Babel and Chokidar. These are available as build commands at the root of the repo: - `yarn build` - `yarn clean` - `yarn watch` Build configuration (i.e. Babel config) is shared as a set standard across the monorepo, and **packages are opted-in to requiring a build**, configured in `scripts/build.config.js`. ``` const buildConfig /*: BuildConfig */ = { // The packages to include for build and their build options packages: { 'dev-middleware': {target: 'node'}, }, }; ``` For now, there is a single `target: 'node'` option — this is necessary as `react-native`, unlike the above other projects, is a repository with packages targeting several runtimes. We may, in future, introduce a build step for other, non-Node, packages — which may be useful for things such as auto-generated TypeScript definitions. {F1043312771} ## Current integration points - `.circleci/config.yml` — Added to `run_yarn` (with project install). - Root `yarn start` — Convenience for local developers. - `yarn start` within `packages/rn-tester` — Convenience for local developers. **Planned**: I will be adding notes on `yarn build` to the following "Contributing" website pages: - https://reactnative.dev/contributing/overview#contributing-code - https://reactnative.dev/contributing/how-to-open-a-pull-request#chapter-ii-implementing-your-changes **This is not load bearing quite yet**: There are not yet any built packages added to the dependencies of `packages/react-native/`, so this will be further tested in a later PR. ### Alternative designs **Per-package config file** Replace `scripts/build/config.js` with a package-defined key in in `package.json`, similar to Jest's [`publishConfig`](https://github.com/jestjs/jest/blob/1f019afdcdfc54a6664908bb45f343db4e3d0848/packages/jest-cli/package.json#L87C3-L89C4). ``` "buildConfig": { "type": "node" }, ``` This would be the only customisation required, with a single Babel config still standardised. Another option this might receive in future is `enableTypeScriptCodgeen`. **Rollup** More sophisticated build tool for Node.js, used by the React codebase (albeit within a custom script setup as well). **Lerna and Nx** - Most sophisticated setup enabling caching and optimised cloud runs. - Probably the most likely thing we'll move towards at a later stage. Changelog: [Internal] Differential Revision: D46759508 fbshipit-source-id: f16807abaa38035eccbcf416c5b08da924f44f2e

Summary: Pull Request resolved: facebook#38240 ## Context RFC: Decoupling Flipper from React Native core: react-native-community/discussions-and-proposals#641 ## Changes To support incoming new React Native packages around debugging (including migrating over [`react-native-community/cli-plugin-metro`](https://github.com/react-native-community/cli/tree/main/packages/cli-plugin-metro)) — which target Node.js and require a build step, this PR adds a minimal shared build setup across the `react-native` monorepo. The setup is closely inspired/based on the build scripts in Jest, Metro, and React Native CLI — and is a simple set of script wrappers around Babel and Chokidar. These are available as build commands at the root of the repo: - `yarn build` - `yarn clean` - `yarn watch` Build configuration (i.e. Babel config) is shared as a set standard across the monorepo, and **packages are opted-in to requiring a build**, configured in `scripts/build.config.js`. ``` const buildConfig /*: BuildConfig */ = { // The packages to include for build and their build options packages: { 'dev-middleware': {target: 'node'}, }, }; ``` For now, there is a single `target: 'node'` option — this is necessary as `react-native`, unlike the above other projects, is a repository with packages targeting several runtimes. We may, in future, introduce a build step for other, non-Node, packages — which may be useful for things such as auto-generated TypeScript definitions. {F1043312771} ## Current integration points - `.circleci/config.yml` — Added to `run_yarn` (with project install). - Root `yarn start` — Convenience for local developers. - `yarn start` within `packages/rn-tester` — Convenience for local developers. **Planned**: I will be adding notes on `yarn build` to the following "Contributing" website pages: - https://reactnative.dev/contributing/overview#contributing-code - https://reactnative.dev/contributing/how-to-open-a-pull-request#chapter-ii-implementing-your-changes **This is not load bearing quite yet**: There are not yet any built packages added to the dependencies of `packages/react-native/`, so this will be further tested in a later PR. ### Alternative designs **Per-package config file** Replace `scripts/build/config.js` with a package-defined key in in `package.json`, similar to Jest's [`publishConfig`](https://github.com/jestjs/jest/blob/1f019afdcdfc54a6664908bb45f343db4e3d0848/packages/jest-cli/package.json#L87C3-L89C4). ``` "buildConfig": { "type": "node" }, ``` This would be the only customisation required, with a single Babel config still standardised. Another option this might receive in future is `enableTypeScriptCodgeen`. **Rollup** More sophisticated build tool for Node.js, used by the React codebase (albeit within a custom script setup as well). **Lerna and Nx** - Most sophisticated setup enabling caching and optimised cloud runs. - Probably the most likely thing we'll move towards at a later stage. Changelog: [Internal] Differential Revision: D46759508 fbshipit-source-id: d87c8ab8d2e202f1bcf56bb71e2d7ac1a3c6fc6a

Summary: Pull Request resolved: facebook#38240 ## Context RFC: Decoupling Flipper from React Native core: react-native-community/discussions-and-proposals#641 ## Changes To support incoming new React Native packages around debugging (including migrating over [`react-native-community/cli-plugin-metro`](https://github.com/react-native-community/cli/tree/main/packages/cli-plugin-metro)) — which target Node.js and require a build step, this PR adds a minimal shared build setup across the `react-native` monorepo. The setup is closely inspired/based on the build scripts in Jest, Metro, and React Native CLI — and is a simple set of script wrappers around Babel and Chokidar. These are available as build commands at the root of the repo: - `yarn build` - `yarn clean` - `yarn watch` Build configuration (i.e. Babel config) is shared as a set standard across the monorepo, and **packages are opted-in to requiring a build**, configured in `scripts/build.config.js`. ``` const buildConfig /*: BuildConfig */ = { // The packages to include for build and their build options packages: { 'dev-middleware': {target: 'node'}, }, }; ``` For now, there is a single `target: 'node'` option — this is necessary as `react-native`, unlike the above other projects, is a repository with packages targeting several runtimes. We may, in future, introduce a build step for other, non-Node, packages — which may be useful for things such as auto-generated TypeScript definitions. {F1043312771} ## Current integration points - `.circleci/config.yml` — Added to `run_yarn` (with project install). - Root `yarn start` — Convenience for local developers. - `yarn start` within `packages/rn-tester` — Convenience for local developers. **Planned**: I will be adding notes on `yarn build` to the following "Contributing" website pages: - https://reactnative.dev/contributing/overview#contributing-code - https://reactnative.dev/contributing/how-to-open-a-pull-request#chapter-ii-implementing-your-changes **This is not load bearing quite yet**: There are not yet any built packages added to the dependencies of `packages/react-native/`, so this will be further tested in a later PR. ### Alternative designs **Per-package config file** Replace `scripts/build/config.js` with a package-defined key in in `package.json`, similar to Jest's [`publishConfig`](https://github.com/jestjs/jest/blob/1f019afdcdfc54a6664908bb45f343db4e3d0848/packages/jest-cli/package.json#L87C3-L89C4). ``` "buildConfig": { "type": "node" }, ``` This would be the only customisation required, with a single Babel config still standardised. Another option this might receive in future is `enableTypeScriptCodgeen`. **Rollup** More sophisticated build tool for Node.js, used by the React codebase (albeit within a custom script setup as well). **Lerna and Nx** - Most sophisticated setup enabling caching and optimised cloud runs. - Probably the most likely thing we'll move towards at a later stage. Changelog: [Internal] Differential Revision: D46759508 fbshipit-source-id: b6e9bb04eff5f4909073a806f5dbdb2532ccecbc

facebook-github-bot · 2023-07-10T14:19:15Z

This pull request was exported from Phabricator. Differential Revision: D46759508

Summary: Pull Request resolved: facebook#38240 ## Context RFC: Decoupling Flipper from React Native core: react-native-community/discussions-and-proposals#641 ## Changes To support incoming new React Native packages around debugging (including migrating over [`react-native-community/cli-plugin-metro`](https://github.com/react-native-community/cli/tree/main/packages/cli-plugin-metro)) — which target Node.js and require a build step, this PR adds a minimal shared build setup across the `react-native` monorepo. The setup is closely inspired/based on the build scripts in Jest, Metro, and React Native CLI — and is a simple set of script wrappers around Babel and Chokidar. These are available as build commands at the root of the repo: - `yarn build` - `yarn clean` - `yarn watch` Build configuration (i.e. Babel config) is shared as a set standard across the monorepo, and **packages are opted-in to requiring a build**, configured in `scripts/build.config.js`. ``` const buildConfig /*: BuildConfig */ = { // The packages to include for build and their build options packages: { 'dev-middleware': {target: 'node'}, }, }; ``` For now, there is a single `target: 'node'` option — this is necessary as `react-native`, unlike the above other projects, is a repository with packages targeting several runtimes. We may, in future, introduce a build step for other, non-Node, packages — which may be useful for things such as auto-generated TypeScript definitions. {F1043312771} ## Current integration points - `.circleci/config.yml` — Added to `run_yarn` (with project install). - Root `yarn start` — Convenience for local developers. - `yarn start` within `packages/rn-tester` — Convenience for local developers. **Planned**: I will be adding notes on `yarn build` to the following "Contributing" website pages: - https://reactnative.dev/contributing/overview#contributing-code - https://reactnative.dev/contributing/how-to-open-a-pull-request#chapter-ii-implementing-your-changes **This is not load bearing quite yet**: There are not yet any built packages added to the dependencies of `packages/react-native/`, so this will be further tested in a later PR. ### Alternative designs **Per-package config file** Replace `scripts/build/config.js` with a package-defined key in in `package.json`, similar to Jest's [`publishConfig`](https://github.com/jestjs/jest/blob/1f019afdcdfc54a6664908bb45f343db4e3d0848/packages/jest-cli/package.json#L87C3-L89C4). ``` "buildConfig": { "type": "node" }, ``` This would be the only customisation required, with a single Babel config still standardised. Another option this might receive in future is `enableTypeScriptCodgeen`. **Rollup** More sophisticated build tool for Node.js, used by the React codebase (albeit within a custom script setup as well). **Lerna and Nx** - Most sophisticated setup enabling caching and optimised cloud runs. - Probably the most likely thing we'll move towards at a later stage. Changelog: [Internal] Differential Revision: D46759508 fbshipit-source-id: af17e146b2f6f6f14156ae7784f61f3a4bfffbee

Summary: Pull Request resolved: facebook#38240 ## Context RFC: Decoupling Flipper from React Native core: react-native-community/discussions-and-proposals#641 ## Changes To support incoming new React Native packages around debugging (including migrating over [`react-native-community/cli-plugin-metro`](https://github.com/react-native-community/cli/tree/main/packages/cli-plugin-metro)) — which target Node.js and require a build step, this PR adds a minimal shared build setup across the `react-native` monorepo. The setup is closely inspired/based on the build scripts in Jest, Metro, and React Native CLI — and is a simple set of script wrappers around Babel and Chokidar. These are available as build commands at the root of the repo: - `yarn build` - `yarn clean` - `yarn watch` Build configuration (i.e. Babel config) is shared as a set standard across the monorepo, and **packages are opted-in to requiring a build**, configured in `scripts/build.config.js`. ``` const buildConfig /*: BuildConfig */ = { // The packages to include for build and their build options packages: { 'dev-middleware': {target: 'node'}, }, }; ``` For now, there is a single `target: 'node'` option — this is necessary as `react-native`, unlike the above other projects, is a repository with packages targeting several runtimes. We may, in future, introduce a build step for other, non-Node, packages — which may be useful for things such as auto-generated TypeScript definitions. {F1043312771} ## Current integration points - `.circleci/config.yml` — Added to `run_yarn` (with project install). - Root `yarn start` — Convenience for local developers. - `yarn start` within `packages/rn-tester` — Convenience for local developers. **Planned**: I will be adding notes on `yarn build` to the following "Contributing" website pages: - https://reactnative.dev/contributing/overview#contributing-code - https://reactnative.dev/contributing/how-to-open-a-pull-request#chapter-ii-implementing-your-changes **This is not load bearing quite yet**: There are not yet any built packages added to the dependencies of `packages/react-native/`, so this will be further tested in a later PR. ### Alternative designs **Per-package config file** Replace `scripts/build/config.js` with a package-defined key in in `package.json`, similar to Jest's [`publishConfig`](https://github.com/jestjs/jest/blob/1f019afdcdfc54a6664908bb45f343db4e3d0848/packages/jest-cli/package.json#L87C3-L89C4). ``` "buildConfig": { "type": "node" }, ``` This would be the only customisation required, with a single Babel config still standardised. Another option this might receive in future is `enableTypeScriptCodgeen`. **Rollup** More sophisticated build tool for Node.js, used by the React codebase (albeit within a custom script setup as well). **Lerna and Nx** - Most sophisticated setup enabling caching and optimised cloud runs. - Probably the most likely thing we'll move towards at a later stage. Changelog: [Internal] Differential Revision: D46759508 fbshipit-source-id: 4168d445b95213dd4e3123f5039914486fb3e2e8

facebook-github-bot · 2023-07-10T15:41:39Z

This pull request was exported from Phabricator. Differential Revision: D46759508

Summary: Pull Request resolved: facebook#38240 ## Context RFC: Decoupling Flipper from React Native core: react-native-community/discussions-and-proposals#641 ## Changes To support incoming new React Native packages around debugging (including migrating over [`react-native-community/cli-plugin-metro`](https://github.com/react-native-community/cli/tree/main/packages/cli-plugin-metro)) — which target Node.js and require a build step, this PR adds a minimal shared build setup across the `react-native` monorepo. The setup is closely inspired/based on the build scripts in Jest, Metro, and React Native CLI — and is a simple set of script wrappers around Babel and Chokidar. These are available as build commands at the root of the repo: - `yarn build` - `yarn clean` - `yarn watch` Build configuration (i.e. Babel config) is shared as a set standard across the monorepo, and **packages are opted-in to requiring a build**, configured in `scripts/build.config.js`. ``` const buildConfig /*: BuildConfig */ = { // The packages to include for build and their build options packages: { 'dev-middleware': {target: 'node'}, }, }; ``` For now, there is a single `target: 'node'` option — this is necessary as `react-native`, unlike the above other projects, is a repository with packages targeting several runtimes. We may, in future, introduce a build step for other, non-Node, packages — which may be useful for things such as auto-generated TypeScript definitions. {F1043312771} ## Current integration points - `.circleci/config.yml` — Added to `run_yarn` (with project install). - Root `yarn start` — Convenience for local developers. - `yarn start` within `packages/rn-tester` — Convenience for local developers. **Planned**: I will be adding notes on `yarn build` to the following "Contributing" website pages: - https://reactnative.dev/contributing/overview#contributing-code - https://reactnative.dev/contributing/how-to-open-a-pull-request#chapter-ii-implementing-your-changes **This is not load bearing quite yet**: There are not yet any built packages added to the dependencies of `packages/react-native/`, so this will be further tested in a later PR. ### Alternative designs **Per-package config file** Replace `scripts/build/config.js` with a package-defined key in in `package.json`, similar to Jest's [`publishConfig`](https://github.com/jestjs/jest/blob/1f019afdcdfc54a6664908bb45f343db4e3d0848/packages/jest-cli/package.json#L87C3-L89C4). ``` "buildConfig": { "type": "node" }, ``` This would be the only customisation required, with a single Babel config still standardised. Another option this might receive in future is `enableTypeScriptCodgeen`. **Rollup** More sophisticated build tool for Node.js, used by the React codebase (albeit within a custom script setup as well). **Lerna and Nx** - Most sophisticated setup enabling caching and optimised cloud runs. - Probably the most likely thing we'll move towards at a later stage. Changelog: [Internal] Differential Revision: D46759508 fbshipit-source-id: 566d20bbd5cd75a635a0f8e1fd00372c2a924721

Summary: Pull Request resolved: facebook#38240 ## Context RFC: Decoupling Flipper from React Native core: react-native-community/discussions-and-proposals#641 ## Changes To support incoming new React Native packages around debugging (including migrating over [`react-native-community/cli-plugin-metro`](https://github.com/react-native-community/cli/tree/main/packages/cli-plugin-metro)) — which target Node.js and require a build step, this PR adds a minimal shared build setup across the `react-native` monorepo. The setup is closely inspired/based on the build scripts in Jest, Metro, and React Native CLI — and is a simple set of script wrappers around Babel and Chokidar. These are available as build commands at the root of the repo: - `yarn build` - `yarn clean` - `yarn watch` Build configuration (i.e. Babel config) is shared as a set standard across the monorepo, and **packages are opted-in to requiring a build**, configured in `scripts/build.config.js`. ``` const buildConfig /*: BuildConfig */ = { // The packages to include for build and their build options packages: { 'dev-middleware': {target: 'node'}, }, }; ``` For now, there is a single `target: 'node'` option — this is necessary as `react-native`, unlike the above other projects, is a repository with packages targeting several runtimes. We may, in future, introduce a build step for other, non-Node, packages — which may be useful for things such as auto-generated TypeScript definitions. {F1043312771} ## Current integration points - `.circleci/config.yml` — Added to `run_yarn` (with project install). - Root `yarn start` — Convenience for local developers. - `yarn start` within `packages/rn-tester` — Convenience for local developers. **Planned**: I will be adding notes on `yarn build` to the following "Contributing" website pages: - https://reactnative.dev/contributing/overview#contributing-code - https://reactnative.dev/contributing/how-to-open-a-pull-request#chapter-ii-implementing-your-changes **This is not load bearing quite yet**: There are not yet any built packages added to the dependencies of `packages/react-native/`, so this will be further tested in a later PR. ### Alternative designs **Per-package config file** Replace `scripts/build/config.js` with a package-defined key in in `package.json`, similar to Jest's [`publishConfig`](https://github.com/jestjs/jest/blob/1f019afdcdfc54a6664908bb45f343db4e3d0848/packages/jest-cli/package.json#L87C3-L89C4). ``` "buildConfig": { "type": "node" }, ``` This would be the only customisation required, with a single Babel config still standardised. Another option this might receive in future is `enableTypeScriptCodgeen`. **Rollup** More sophisticated build tool for Node.js, used by the React codebase (albeit within a custom script setup as well). **Lerna and Nx** - Most sophisticated setup enabling caching and optimised cloud runs. - Probably the most likely thing we'll move towards at a later stage. Changelog: [Internal] Differential Revision: D46759508 fbshipit-source-id: 89fdcd767ea383128cd04f52b2ee790f184f263f

facebook-github-bot · 2023-07-11T12:32:30Z

This pull request was exported from Phabricator. Differential Revision: D46759508

Summary: Pull Request resolved: facebook#38240 ## Context RFC: Decoupling Flipper from React Native core: react-native-community/discussions-and-proposals#641 ## Changes To support incoming new React Native packages around debugging (including migrating over [`react-native-community/cli-plugin-metro`](https://github.com/react-native-community/cli/tree/main/packages/cli-plugin-metro)) — which target Node.js and require a build step, this PR adds a minimal shared build setup across the `react-native` monorepo. The setup is closely inspired/based on the build scripts in Jest, Metro, and React Native CLI — and is a simple set of script wrappers around Babel and Chokidar. These are available as build commands at the root of the repo: - `yarn build` - `yarn clean` - `yarn watch` Build configuration (i.e. Babel config) is shared as a set standard across the monorepo, and **packages are opted-in to requiring a build**, configured in `scripts/build.config.js`. ``` const buildConfig /*: BuildConfig */ = { // The packages to include for build and their build options packages: { 'dev-middleware': {target: 'node'}, }, }; ``` For now, there is a single `target: 'node'` option — this is necessary as `react-native`, unlike the above other projects, is a repository with packages targeting several runtimes. We may, in future, introduce a build step for other, non-Node, packages — which may be useful for things such as auto-generated TypeScript definitions. {F1043312771} ## Current integration points - `.circleci/config.yml` — Added to `run_yarn` (with project install). - Root `yarn start` — Convenience for local developers. - `yarn start` within `packages/rn-tester` — Convenience for local developers. **Planned**: I will be adding notes on `yarn build` to the following "Contributing" website pages: - https://reactnative.dev/contributing/overview#contributing-code - https://reactnative.dev/contributing/how-to-open-a-pull-request#chapter-ii-implementing-your-changes **This is not load bearing quite yet**: There are not yet any built packages added to the dependencies of `packages/react-native/`, so this will be further tested in a later PR. ### Alternative designs **Per-package config file** Replace `scripts/build/config.js` with a package-defined key in in `package.json`, similar to Jest's [`publishConfig`](https://github.com/jestjs/jest/blob/1f019afdcdfc54a6664908bb45f343db4e3d0848/packages/jest-cli/package.json#L87C3-L89C4). ``` "buildConfig": { "type": "node" }, ``` This would be the only customisation required, with a single Babel config still standardised. Another option this might receive in future is `enableTypeScriptCodgeen`. **Rollup** More sophisticated build tool for Node.js, used by the React codebase (albeit within a custom script setup as well). **Lerna and Nx** - Most sophisticated setup enabling caching and optimised cloud runs. - Probably the most likely thing we'll move towards at a later stage. Changelog: [Internal] Differential Revision: D46759508 fbshipit-source-id: d6d2c03b46d534be1e7a7bc07793b5b585339b8a

Summary: Pull Request resolved: facebook#38240 ## Context RFC: Decoupling Flipper from React Native core: react-native-community/discussions-and-proposals#641 ## Changes To support incoming new React Native packages around debugging (including migrating over [`react-native-community/cli-plugin-metro`](https://github.com/react-native-community/cli/tree/main/packages/cli-plugin-metro)) — which target Node.js and require a build step, this PR adds a minimal shared build setup across the `react-native` monorepo. The setup is closely inspired/based on the build scripts in Jest, Metro, and React Native CLI — and is a simple set of script wrappers around Babel and Chokidar. These are available as build commands at the root of the repo: - `yarn build` - `yarn clean` - `yarn watch` Build configuration (i.e. Babel config) is shared as a set standard across the monorepo, and **packages are opted-in to requiring a build**, configured in `scripts/build.config.js`. ``` const buildConfig /*: BuildConfig */ = { // The packages to include for build and their build options packages: { 'dev-middleware': {target: 'node'}, }, }; ``` For now, there is a single `target: 'node'` option — this is necessary as `react-native`, unlike the above other projects, is a repository with packages targeting several runtimes. We may, in future, introduce a build step for other, non-Node, packages — which may be useful for things such as auto-generated TypeScript definitions. {F1043312771} ## Current integration points - `.circleci/config.yml` — Added to `run_yarn` (with project install). - Root `yarn start` — Convenience for local developers. - `yarn start` within `packages/rn-tester` — Convenience for local developers. **Planned**: I will be adding notes on `yarn build` to the following "Contributing" website pages: - https://reactnative.dev/contributing/overview#contributing-code - https://reactnative.dev/contributing/how-to-open-a-pull-request#chapter-ii-implementing-your-changes **This is not load bearing quite yet**: There are not yet any built packages added to the dependencies of `packages/react-native/`, so this will be further tested in a later PR. ### Alternative designs **Per-package config file** Replace `scripts/build/config.js` with a package-defined key in in `package.json`, similar to Jest's [`publishConfig`](https://github.com/jestjs/jest/blob/1f019afdcdfc54a6664908bb45f343db4e3d0848/packages/jest-cli/package.json#L87C3-L89C4). ``` "buildConfig": { "type": "node" }, ``` This would be the only customisation required, with a single Babel config still standardised. Another option this might receive in future is `enableTypeScriptCodgeen`. **Rollup** More sophisticated build tool for Node.js, used by the React codebase (albeit within a custom script setup as well). **Lerna and Nx** - Most sophisticated setup enabling caching and optimised cloud runs. - Probably the most likely thing we'll move towards at a later stage. Changelog: [Internal] Differential Revision: D46759508 fbshipit-source-id: ea843ff64dcccf06be9de90637368a3f620a51e0

facebook-github-bot · 2023-07-11T12:58:33Z

This pull request was exported from Phabricator. Differential Revision: D46759508

Summary: Pull Request resolved: facebook#38240 ## Context RFC: Decoupling Flipper from React Native core: react-native-community/discussions-and-proposals#641 ## Changes To support incoming new React Native packages around debugging (including migrating over [`react-native-community/cli-plugin-metro`](https://github.com/react-native-community/cli/tree/main/packages/cli-plugin-metro)) — which target Node.js and require a build step, this PR adds a minimal shared build setup across the `react-native` monorepo. The setup is closely inspired/based on the build scripts in Jest, Metro, and React Native CLI — and is a simple set of script wrappers around Babel and Chokidar. These are available as build commands at the root of the repo: - `yarn build` - `yarn clean` - `yarn watch` Build configuration (i.e. Babel config) is shared as a set standard across the monorepo, and **packages are opted-in to requiring a build**, configured in `scripts/build.config.js`. ``` const buildConfig /*: BuildConfig */ = { // The packages to include for build and their build options packages: { 'dev-middleware': {target: 'node'}, }, }; ``` For now, there is a single `target: 'node'` option — this is necessary as `react-native`, unlike the above other projects, is a repository with packages targeting several runtimes. We may, in future, introduce a build step for other, non-Node, packages — which may be useful for things such as auto-generated TypeScript definitions. {F1043312771} ## Current integration points - `.circleci/config.yml` — Added to `run_yarn` (with project install). - Root `yarn start` — Convenience for local developers. - `yarn start` within `packages/rn-tester` — Convenience for local developers. **Planned**: I will be adding notes on `yarn build` to the following "Contributing" website pages: - https://reactnative.dev/contributing/overview#contributing-code - https://reactnative.dev/contributing/how-to-open-a-pull-request#chapter-ii-implementing-your-changes **This is not load bearing quite yet**: There are not yet any built packages added to the dependencies of `packages/react-native/`, so this will be further tested in a later PR. ### Alternative designs **Per-package config file** Replace `scripts/build/config.js` with a package-defined key in in `package.json`, similar to Jest's [`publishConfig`](https://github.com/jestjs/jest/blob/1f019afdcdfc54a6664908bb45f343db4e3d0848/packages/jest-cli/package.json#L87C3-L89C4). ``` "buildConfig": { "type": "node" }, ``` This would be the only customisation required, with a single Babel config still standardised. Another option this might receive in future is `enableTypeScriptCodgeen`. **Rollup** More sophisticated build tool for Node.js, used by the React codebase (albeit within a custom script setup as well). **Lerna and Nx** - Most sophisticated setup enabling caching and optimised cloud runs. - Probably the most likely thing we'll move towards at a later stage. Changelog: [Internal] Differential Revision: D46759508 fbshipit-source-id: dbbee26e82dbcdeaad1ef5532d817aea9dc1382d

facebook-github-bot · 2023-07-11T13:07:40Z

This pull request was exported from Phabricator. Differential Revision: D46759508

facebook-github-bot · 2023-07-13T10:49:03Z

This pull request was exported from Phabricator. Differential Revision: D46759508

Summary: Pull Request resolved: facebook#38240 ## Context RFC: Decoupling Flipper from React Native core: react-native-community/discussions-and-proposals#641 ## Changes To support incoming new React Native packages around debugging (including migrating over [`react-native-community/cli-plugin-metro`](https://github.com/react-native-community/cli/tree/main/packages/cli-plugin-metro)) — which target Node.js and require a build step, this PR adds a minimal shared build setup across the `react-native` monorepo. The setup is closely inspired/based on the build scripts in Jest, Metro, and React Native CLI — and is a simple set of script wrappers around Babel and Chokidar. These are available as build commands at the root of the repo: - `yarn build` - `yarn clean` - `yarn watch` Build configuration (i.e. Babel config) is shared as a set standard across the monorepo, and **packages are opted-in to requiring a build**, configured in `scripts/build.config.js`. ``` const buildConfig /*: BuildConfig */ = { // The packages to include for build and their build options packages: { 'dev-middleware': {target: 'node'}, }, }; ``` For now, there is a single `target: 'node'` option — this is necessary as `react-native`, unlike the above other projects, is a repository with packages targeting several runtimes. We may, in future, introduce a build step for other, non-Node, packages — which may be useful for things such as auto-generated TypeScript definitions. {F1043312771} ## Current integration points - `.circleci/config.yml` — Added to `run_yarn` (with project install). - Root `yarn start` — Convenience for local developers. - `yarn start` within `packages/rn-tester` — Convenience for local developers. **Planned**: I will be adding notes on `yarn build` to the following "Contributing" website pages: - https://reactnative.dev/contributing/overview#contributing-code - https://reactnative.dev/contributing/how-to-open-a-pull-request#chapter-ii-implementing-your-changes **This is not load bearing quite yet**: There are not yet any built packages added to the dependencies of `packages/react-native/`, so this will be further tested in a later PR. ### Alternative designs **Per-package config file** Replace `scripts/build/config.js` with a package-defined key in in `package.json`, similar to Jest's [`publishConfig`](https://github.com/jestjs/jest/blob/1f019afdcdfc54a6664908bb45f343db4e3d0848/packages/jest-cli/package.json#L87C3-L89C4). ``` "buildConfig": { "type": "node" }, ``` This would be the only customisation required, with a single Babel config still standardised. Another option this might receive in future is `enableTypeScriptCodgeen`. **Rollup** More sophisticated build tool for Node.js, used by the React codebase (albeit within a custom script setup as well). **Lerna and Nx** - Most sophisticated setup enabling caching and optimised cloud runs. - Probably the most likely thing we'll move towards at a later stage. Changelog: [Internal] Differential Revision: D46759508 fbshipit-source-id: 8649b75efe2fb1a9d63eb43e5e6edcabef852fb1

Summary: Pull Request resolved: facebook#38240 ## Context RFC: Decoupling Flipper from React Native core: react-native-community/discussions-and-proposals#641 ## Changes To support incoming new React Native packages around debugging (including migrating over [`react-native-community/cli-plugin-metro`](https://github.com/react-native-community/cli/tree/main/packages/cli-plugin-metro)) — which target Node.js and require a build step, this PR adds a minimal shared build setup across the `react-native` monorepo. The setup is closely inspired/based on the build scripts in Jest, Metro, and React Native CLI — and is a simple set of script wrappers around Babel and Chokidar. These are available as build commands at the root of the repo: - `yarn build` - `yarn clean` - `yarn watch` Build configuration (i.e. Babel config) is shared as a set standard across the monorepo, and **packages are opted-in to requiring a build**, configured in `scripts/build.config.js`. ``` const buildConfig /*: BuildConfig */ = { // The packages to include for build and their build options packages: { 'dev-middleware': {target: 'node'}, }, }; ``` For now, there is a single `target: 'node'` option — this is necessary as `react-native`, unlike the above other projects, is a repository with packages targeting several runtimes. We may, in future, introduce a build step for other, non-Node, packages — which may be useful for things such as auto-generated TypeScript definitions. {F1043312771} ## Current integration points - `.circleci/config.yml` — Added to `run_yarn` (with project install). - Root `yarn start` — Convenience for local developers. - `yarn start` within `packages/rn-tester` — Convenience for local developers. **Planned**: I will be adding notes on `yarn build` to the following "Contributing" website pages: - https://reactnative.dev/contributing/overview#contributing-code - https://reactnative.dev/contributing/how-to-open-a-pull-request#chapter-ii-implementing-your-changes **This is not load bearing quite yet**: There are not yet any built packages added to the dependencies of `packages/react-native/`, so this will be further tested in a later PR. ### Alternative designs **Per-package config file** Replace `scripts/build/config.js` with a package-defined key in in `package.json`, similar to Jest's [`publishConfig`](https://github.com/jestjs/jest/blob/1f019afdcdfc54a6664908bb45f343db4e3d0848/packages/jest-cli/package.json#L87C3-L89C4). ``` "buildConfig": { "type": "node" }, ``` This would be the only customisation required, with a single Babel config still standardised. Another option this might receive in future is `enableTypeScriptCodgeen`. **Rollup** More sophisticated build tool for Node.js, used by the React codebase (albeit within a custom script setup as well). **Lerna and Nx** - Most sophisticated setup enabling caching and optimised cloud runs. - Probably the most likely thing we'll move towards at a later stage. Changelog: [Internal] Differential Revision: D46759508 fbshipit-source-id: 4206f213caf6961969dcbdc6a6143cd938e33326

facebook-github-bot · 2023-07-18T21:53:55Z

This pull request was exported from Phabricator. Differential Revision: D46759508

Pranav-yadav · 2023-07-21T16:12:53Z

package.json

@@ -11,8 +11,12 @@
    "outputName": "js-test-results.xml"
  },
  "scripts": {
-    "start": "cd packages/rn-tester && npm run start",
+    "postinstall": "yarn build",


will u pls explain how this is going to help ?

Pranav-yadav · 2023-07-21T16:15:41Z

package.json

+    "build": "node ./scripts/build/build.js",
+    "clean": "node ./scripts/build/clean.js",
+    "watch": "yarn build && node ./scripts/build/watch.js",


I think there's no need for an extra watch script.
We can just have a "single build script" which takes --watch.
That would be awesome.
WDYT?

Pranav-yadav · 2023-07-21T16:19:42Z

scripts/build/build.js

+const config = {
+  allowPositionals: true,
+  options: {
+    help: {type: 'boolean'},


here , adding watch option and calling watch() if provided, could make things better, as I said above.
Context: someCmd build --watch pattern is widely used for generations :)

Pranav-yadav · 2023-07-21T16:29:04Z

scripts/build/clean.js

+  }
+
+  for (const packageName of Object.keys(buildConfig.packages)) {
+    fs.rmSync(path.join(PACKAGES_DIR, packageName, BUILD_DIR), {


can this fail or block, if the stuff it's trying to rm is in use? It's rmSync that's why...

huntie · 2023-07-25T16:31:12Z

Abandoning in favour of a runnable-from-source approach (that still includes build) — will be a separate PR replacing this.

Summary: > NOTE: Replaces facebook#38240 ## Context RFC: Decoupling Flipper from React Native core: react-native-community/discussions-and-proposals#641 ## Changes To support incoming new React Native packages around debugging (including migrating over [`react-native-community/cli-plugin-metro`](https://github.com/react-native-community/cli/tree/main/packages/cli-plugin-metro)) — which target Node.js and require a build step, this PR adds a minimal shared build setup across the `react-native` monorepo. The setup is closely inspired/based on the build scripts in Jest, Metro, and React Native CLI — and is a simple set of script wrappers around Babel. These are available as build commands at the root of the repo: - `yarn build` — Builds all configured packages. Functionally, this: - Outputs a `dist/` directory with built files. - Rewrites package.json `"exports"` to update every `./src/*` reference to `./dist/*` (source of truth). - `scripts/build/babel-register.js` — Allows running all Node.js entry points from source, similar to the current setup in [facebook/metro](https://github.com/facebook/metro). (Example entry point file in this PR: `packages/dev-middleware/src/index.js`) Build configuration (i.e. Babel config) is shared as a set standard across the monorepo, and **packages are opted-in to requiring a build**, configured in `scripts/build.config.js`. ``` const buildConfig /*: BuildConfig */ = { // The packages to include for build and their build options packages: { 'dev-middleware': {target: 'node'}, }, }; ``` For now, there is a single `target: 'node'` option — this is necessary as `react-native`, unlike the above other projects, is a repository with packages targeting several runtimes. We may, in future, introduce a build step for other, non-Node, packages — which may be useful for things such as auto-generated TypeScript definitions. {F1043312771} **Differences from the Metro setup** - References (and compiles out) repo-local `scripts/build/babel-register.js` — removing need for an npm-published dependency. ## Current integration points - **CircleCI** — `yarn build` is added to the `build_npm_package` and `find_and_publish_bumped_packages` jobs. **New Node.js package(s) are not load bearing quite yet**: There are not yet any built packages added to the dependencies of `packages/react-native/`, so this will be further tested in a later PR (and is actively being done in an internal commit stack). ### Alternative designs **Per-package config file** Replace `scripts/build/config.js` with a package-defined key in in `package.json`, similar to Jest's [`publishConfig`](https://github.com/jestjs/jest/blob/1f019afdcdfc54a6664908bb45f343db4e3d0848/packages/jest-cli/package.json#L87C3-L89C4). ``` "buildConfig": { "type": "node" }, ``` This would be the only customisation required, with a single Babel config still standardised. Another option this might receive in future is `enableTypeScriptCodgeen`. **Rollup** More sophisticated build tool for Node.js, used by the React codebase (albeit within a custom script setup as well). **Lerna and Nx** - Most sophisticated setup enabling caching and optimised cloud runs. - Probably the most likely thing we'll move towards at a later stage. Changelog: [Internal] Differential Revision: D47760330 fbshipit-source-id: 7b18321201f3ff8a3e729c6171ca88a3ad319f1e

Summary: Pull Request resolved: facebook#38718 > NOTE: Replaces facebook#38240 ## Context RFC: Decoupling Flipper from React Native core: react-native-community/discussions-and-proposals#641 ## Changes To support incoming new React Native packages around debugging (including migrating over [`react-native-community/cli-plugin-metro`](https://github.com/react-native-community/cli/tree/main/packages/cli-plugin-metro)) — which target Node.js and require a build step, this PR adds a minimal shared build setup across the `react-native` monorepo. The setup is closely inspired/based on the build scripts in Jest, Metro, and React Native CLI — and is a simple set of script wrappers around Babel. These are available as build commands at the root of the repo: - `yarn build` — Builds all configured packages. Functionally, this: - Outputs a `dist/` directory with built files. - Rewrites package.json `"exports"` to update every `./src/*` reference to `./dist/*` (source of truth). - `scripts/build/babel-register.js` — Allows running all Node.js entry points from source, similar to the current setup in [facebook/metro](https://github.com/facebook/metro). (Example entry point file in this PR: `packages/dev-middleware/src/index.js`) Build configuration (i.e. Babel config) is shared as a set standard across the monorepo, and **packages are opted-in to requiring a build**, configured in `scripts/build.config.js`. ``` const buildConfig /*: BuildConfig */ = { // The packages to include for build and their build options packages: { 'dev-middleware': {target: 'node'}, }, }; ``` For now, there is a single `target: 'node'` option — this is necessary as `react-native`, unlike the above other projects, is a repository with packages targeting several runtimes. We may, in future, introduce a build step for other, non-Node, packages — which may be useful for things such as auto-generated TypeScript definitions. {F1043312771} **Differences from the Metro setup** - References (and compiles out) repo-local `scripts/build/babel-register.js` — removing need for an npm-published dependency. ## Current integration points - **CircleCI** — `yarn build` is added to the `build_npm_package` and `find_and_publish_bumped_packages` jobs. **New Node.js package(s) are not load bearing quite yet**: There are not yet any built packages added to the dependencies of `packages/react-native/`, so this will be further tested in a later PR (and is actively being done in an internal commit stack). ### Alternative designs **Per-package config file** Replace `scripts/build/config.js` with a package-defined key in in `package.json`, similar to Jest's [`publishConfig`](https://github.com/jestjs/jest/blob/1f019afdcdfc54a6664908bb45f343db4e3d0848/packages/jest-cli/package.json#L87C3-L89C4). ``` "buildConfig": { "type": "node" }, ``` This would be the only customisation required, with a single Babel config still standardised. Another option this might receive in future is `enableTypeScriptCodgeen`. **Rollup** More sophisticated build tool for Node.js, used by the React codebase (albeit within a custom script setup as well). **Lerna and Nx** - Most sophisticated setup enabling caching and optimised cloud runs. - Probably the most likely thing we'll move towards at a later stage. Changelog: [Internal] Differential Revision: D47760330 fbshipit-source-id: 2c0128f7a3c54e222d3f640f8d2bf48264f23813

Summary: Pull Request resolved: facebook#38718 > NOTE: Replaces facebook#38240 ## Context RFC: Decoupling Flipper from React Native core: react-native-community/discussions-and-proposals#641 ## Changes To support incoming new React Native packages around debugging (including migrating over [`react-native-community/cli-plugin-metro`](https://github.com/react-native-community/cli/tree/main/packages/cli-plugin-metro)) — which target Node.js and require a build step, this PR adds a minimal shared build setup across the `react-native` monorepo. The setup is closely inspired/based on the build scripts in Jest, Metro, and React Native CLI — and is a simple set of script wrappers around Babel. These are available as build commands at the root of the repo: - `yarn build` — Builds all configured packages. Functionally, this: - Outputs a `dist/` directory with built files. - Rewrites package.json `"exports"` to update every `./src/*` reference to `./dist/*` (source of truth). - `scripts/build/babel-register.js` — Allows running all Node.js entry points from source, similar to the current setup in [facebook/metro](https://github.com/facebook/metro). (Example entry point file in this PR: `packages/dev-middleware/src/index.js`) Build configuration (i.e. Babel config) is shared as a set standard across the monorepo, and **packages are opted-in to requiring a build**, configured in `scripts/build.config.js`. ``` const buildConfig /*: BuildConfig */ = { // The packages to include for build and their build options packages: { 'dev-middleware': {target: 'node'}, }, }; ``` For now, there is a single `target: 'node'` option — this is necessary as `react-native`, unlike the above other projects, is a repository with packages targeting several runtimes. We may, in future, introduce a build step for other, non-Node, packages — which may be useful for things such as auto-generated TypeScript definitions. {F1043312771} **Differences from the Metro setup** - References (and compiles out) repo-local `scripts/build/babel-register.js` — removing need for an npm-published dependency. ## Current integration points - **CircleCI** — `yarn build` is added to the `build_npm_package` and `find_and_publish_bumped_packages` jobs. **New Node.js package(s) are not load bearing quite yet**: There are not yet any built packages added to the dependencies of `packages/react-native/`, so this will be further tested in a later PR (and is actively being done in an internal commit stack). ### Alternative designs **Per-package config file** Replace `scripts/build/config.js` with a package-defined key in in `package.json`, similar to Jest's [`publishConfig`](https://github.com/jestjs/jest/blob/1f019afdcdfc54a6664908bb45f343db4e3d0848/packages/jest-cli/package.json#L87C3-L89C4). ``` "buildConfig": { "type": "node" }, ``` This would be the only customisation required, with a single Babel config still standardised. Another option this might receive in future is `enableTypeScriptCodgeen`. **Rollup** More sophisticated build tool for Node.js, used by the React codebase (albeit within a custom script setup as well). **Lerna and Nx** - Most sophisticated setup enabling caching and optimised cloud runs. - Probably the most likely thing we'll move towards at a later stage. Changelog: [Internal] Reviewed By: NickGerleman Differential Revision: D47760330 fbshipit-source-id: 456b506f9e50a43bae9bc902f36910253a0681e0

Summary: Pull Request resolved: #38718 > NOTE: Replaces #38240 ## Context RFC: Decoupling Flipper from React Native core: react-native-community/discussions-and-proposals#641 ## Changes To support incoming new React Native packages around debugging (including migrating over [`react-native-community/cli-plugin-metro`](https://github.com/react-native-community/cli/tree/main/packages/cli-plugin-metro)) — which target Node.js and require a build step, this PR adds a minimal shared build setup across the `react-native` monorepo. The setup is closely inspired/based on the build scripts in Jest, Metro, and React Native CLI — and is a simple set of script wrappers around Babel. These are available as build commands at the root of the repo: - `yarn build` — Builds all configured packages. Functionally, this: - Outputs a `dist/` directory with built files. - Rewrites package.json `"exports"` to update every `./src/*` reference to `./dist/*` (source of truth). - `scripts/build/babel-register.js` — Allows running all Node.js entry points from source, similar to the current setup in [facebook/metro](https://github.com/facebook/metro). (Example entry point file in this PR: `packages/dev-middleware/src/index.js`) Build configuration (i.e. Babel config) is shared as a set standard across the monorepo, and **packages are opted-in to requiring a build**, configured in `scripts/build.config.js`. ``` const buildConfig /*: BuildConfig */ = { // The packages to include for build and their build options packages: { 'dev-middleware': {target: 'node'}, }, }; ``` For now, there is a single `target: 'node'` option — this is necessary as `react-native`, unlike the above other projects, is a repository with packages targeting several runtimes. We may, in future, introduce a build step for other, non-Node, packages — which may be useful for things such as auto-generated TypeScript definitions. {F1043312771} **Differences from the Metro setup** - References (and compiles out) repo-local `scripts/build/babel-register.js` — removing need for an npm-published dependency. ## Current integration points - **CircleCI** — `yarn build` is added to the `build_npm_package` and `find_and_publish_bumped_packages` jobs. **New Node.js package(s) are not load bearing quite yet**: There are not yet any built packages added to the dependencies of `packages/react-native/`, so this will be further tested in a later PR (and is actively being done in an internal commit stack). ### Alternative designs **Per-package config file** Replace `scripts/build/config.js` with a package-defined key in in `package.json`, similar to Jest's [`publishConfig`](https://github.com/jestjs/jest/blob/1f019afdcdfc54a6664908bb45f343db4e3d0848/packages/jest-cli/package.json#L87C3-L89C4). ``` "buildConfig": { "type": "node" }, ``` This would be the only customisation required, with a single Babel config still standardised. Another option this might receive in future is `enableTypeScriptCodgeen`. **Rollup** More sophisticated build tool for Node.js, used by the React codebase (albeit within a custom script setup as well). **Lerna and Nx** - Most sophisticated setup enabling caching and optimised cloud runs. - Probably the most likely thing we'll move towards at a later stage. Changelog: [Internal] Reviewed By: NickGerleman Differential Revision: D47760330 fbshipit-source-id: 38ec94708ce3d9946a197d80885781e9707c5841

facebook-github-bot added CLA Signed This label is managed by the Facebook bot. Authors need to sign the CLA before a PR can be reviewed. p: Facebook Partner: Facebook Partner fb-exported labels Jul 7, 2023

huntie mentioned this pull request Jul 7, 2023

[docs] Add guidance on repo build scripts facebook/react-native-website#3788

Merged

This comment was marked as resolved.

Sign in to view

huntie force-pushed the export-D46759508 branch from dc788cf to 2f4e80a Compare July 7, 2023 16:41

Pranav-yadav reviewed Jul 8, 2023

View reviewed changes

huntie force-pushed the export-D46759508 branch from 2f4e80a to 08c1fcd Compare July 10, 2023 14:19

huntie force-pushed the export-D46759508 branch from 08c1fcd to 8e49b22 Compare July 10, 2023 15:41

huntie force-pushed the export-D46759508 branch from 8e49b22 to a16af8d Compare July 11, 2023 12:32

huntie force-pushed the export-D46759508 branch from a16af8d to cccaa32 Compare July 11, 2023 12:58

huntie force-pushed the export-D46759508 branch from cccaa32 to e6dcb05 Compare July 11, 2023 13:07

huntie force-pushed the export-D46759508 branch from e6dcb05 to 4afcbfa Compare July 13, 2023 10:49

huntie force-pushed the export-D46759508 branch from 4afcbfa to 87edd0e Compare July 18, 2023 21:54

Pranav-yadav reviewed Jul 21, 2023

View reviewed changes

huntie closed this Jul 25, 2023

huntie deleted the export-D46759508 branch July 25, 2023 16:31

huntie mentioned this pull request Aug 1, 2023

Add shared monorepo build setup #38718

Closed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Add shared monorepo build setup #38240

Add shared monorepo build setup #38240

huntie commented Jul 7, 2023 •

edited

Loading

facebook-github-bot commented Jul 7, 2023

github-actions bot commented Jul 7, 2023 •

edited

Loading

This comment was marked as resolved.

analysis-bot commented Jul 7, 2023 •

edited

Loading

facebook-github-bot commented Jul 7, 2023

Pranav-yadav Jul 8, 2023

huntie Jul 10, 2023

Pranav-yadav Jul 21, 2023

facebook-github-bot commented Jul 10, 2023

facebook-github-bot commented Jul 10, 2023

facebook-github-bot commented Jul 11, 2023

facebook-github-bot commented Jul 11, 2023

facebook-github-bot commented Jul 11, 2023

facebook-github-bot commented Jul 13, 2023

facebook-github-bot commented Jul 18, 2023

Pranav-yadav Jul 21, 2023

Pranav-yadav Jul 21, 2023

Pranav-yadav Jul 21, 2023 •

edited

Loading

Pranav-yadav Jul 21, 2023 •

edited

Loading

huntie commented Jul 25, 2023

Add shared monorepo build setup #38240

Add shared monorepo build setup #38240

Conversation

huntie commented Jul 7, 2023 • edited Loading

Context

Changes

Current integration points

Alternative designs

facebook-github-bot commented Jul 7, 2023

github-actions bot commented Jul 7, 2023 • edited Loading

This comment was marked as resolved.

analysis-bot commented Jul 7, 2023 • edited Loading

facebook-github-bot commented Jul 7, 2023

Pranav-yadav Jul 8, 2023

Choose a reason for hiding this comment

huntie Jul 10, 2023

Choose a reason for hiding this comment

Pranav-yadav Jul 21, 2023

Choose a reason for hiding this comment

facebook-github-bot commented Jul 10, 2023

facebook-github-bot commented Jul 10, 2023

facebook-github-bot commented Jul 11, 2023

facebook-github-bot commented Jul 11, 2023

facebook-github-bot commented Jul 11, 2023

facebook-github-bot commented Jul 13, 2023

facebook-github-bot commented Jul 18, 2023

Pranav-yadav Jul 21, 2023

Choose a reason for hiding this comment

Pranav-yadav Jul 21, 2023

Choose a reason for hiding this comment

Pranav-yadav Jul 21, 2023 • edited Loading

Choose a reason for hiding this comment

Pranav-yadav Jul 21, 2023 • edited Loading

Choose a reason for hiding this comment

huntie commented Jul 25, 2023

huntie commented Jul 7, 2023 •

edited

Loading

github-actions bot commented Jul 7, 2023 •

edited

Loading

analysis-bot commented Jul 7, 2023 •

edited

Loading

Pranav-yadav Jul 21, 2023 •

edited

Loading

Pranav-yadav Jul 21, 2023 •

edited

Loading