Changes in withMetroMultiPlatform.ts

46f023fa - [RFC] API Routes in Expo Router (#24429)

Fri, 15 Sep 2023 23:04:53 +0000

[RFC] API Routes in Expo Router (#24429)# Why Servers are an important part of developing many different types of apps, but they're much harder to configure than they need to be. API Routes will enable users to express some abstract JavaScript code that runs in a server by simply creating a file in the app directory, and adding the `+api.js` suffix. For example, to securely interact with OpenAI, simply: ```ts // app/generate+api.ts import { ExpoRequest, ExpoResponse } from 'expo-router/server'; export async function POST(req: ExpoRequest): Promise { const { prompt } = await req.json(); const json = await fetch('https://api.openai.com/v1/engines/text-davinci-003/completions', { headers: { 'Content-Type': 'application/json', // `OPENAI_API_KEY` is pulled from the .env file when running in Expo CLI. Authorization: `Bearer ${process.env.OPENAI_API_KEY ?? ''}`, }, method: 'POST', body: JSON.stringify({ prompt, max_tokens: 100, }), }).then(res => res.json()); // Return as JSON return ExpoResponse.json(json); } ``` This will be served at `http://localhost:8081/generate` with `npx expo` and can be used by making a request: ```sh $ curl -X POST -H "Content-Type: application/json" -d \'{"prompt":"Hello, my name is"}\' http://localhost:8081/generate ``` Expo Router polyfills the URL and `window.location` object on native to allow for universally requesting with a relative URL: ```js // Expo prepends the host and port to the URL automatically in development. const json = await fetch('/generate').then(res => res.json()); ``` # How - API Routes are bundled with Metro, leveraging all the same functionality as the rest of the app and website. - The project babel config is used to transpile the API routes. Indication is passed to the Babel caller via the `isServer` boolean. This can be used to change the preset based on the environment. - Each API route is bundled into a standalone file in the `dist/_expo` directory. This is akin to ncc, the tool we use to make Create Expo App download in ~1 second. - Create a new package `@expo/server` which includes the requisite middleware and runtime polyfills for the Expo server environment. - Add a new routes manifest which will be used by `@expo/server` to serve up the three types of routes: HTML routes, API routes, and not found routes (404s). - Add a new export `expo-router/server` (potentially will be moved to `expo/server`) which contains the `ExpoRequest` and `ExpoResponse` objects. These are all based on the WinterCG specification, and include some additional properties for interop with the Expo Router filesystem convention. These are inspired by Remix, SvelteKit, and Next.js for simplicity. - Add a new export mode `web.output: "server"` which can be used to export a dynamic server. Note: I may drop this for now and make server the default since there's no expo-specific hosting code that must be exported. - This PR adds the ability to host the app with an express server, different production adapters to follow. # Test Plan In addition to all the E2E Metro tests, I've added a new E2E runner which starts a server and pings different requests to ensure expected behavior. These run in the CLI as opposed to the `@expo/server` package. - resolve ENG-10057 ENG-8243 ENG-8082 ENG-8079 ENG-8242 ENG-8081 ENG-8080 ENG-9625 --------- Co-authored-by: Expo Bot <34669131+expo-bot@users.noreply.github.com> Co-authored-by: Cedric van Putten List of files: /expo/packages/@expo/cli/src/start/server/metro/withMetroMultiPlatform.ts

92ddc08b - Support mocking Node.js externals for client-side bundles. (#24453)

Thu, 14 Sep 2023 23:51:49 +0000

Support mocking Node.js externals for client-side bundles. (#24453)# Why - Fix regression in https://github.com/expo/expo/pull/24199 which breaks all Metro web tests. --------- Co-authored-by: Expo Bot <34669131+expo-bot@users.noreply.github.com> List of files: /expo/packages/@expo/cli/src/start/server/metro/withMetroMultiPlatform.ts

eb6aeb3b - Patch `react-native-web` AppContainer to prevent adding extra divs. (#24093)

Wed, 23 Aug 2023 22:25:11 +0000

Patch `react-native-web` AppContainer to prevent adding extra divs. (#24093)# Why `react-native-web` wraps the root with two extra Views, not only is this bloat but it breaks how we static render because we pass the root +html (``) to the static rendering system. If you pass `

` to a browser, it will be broken. This PR simply patches the metro resolution to use a basic in-out function when react-native-web attempts to wrap the root. # Test Plan - E2E metro should pass. --------- Co-authored-by: Expo Bot <34669131+expo-bot@users.noreply.github.com> List of files: /expo/packages/@expo/cli/src/start/server/metro/withMetroMultiPlatform.ts

8a424beb - [lint] Upgrade to Prettier v3, typescript-eslint to v6 (#23544)

Fri, 11 Aug 2023 07:31:41 +0000

[lint] Upgrade to Prettier v3, typescript-eslint to v6 (#23544)Why --- Prettier 3 is out. Add support for it with this linter config. **Note for reviewer:** the first commit is the one with the actual changes. The rest of this PR are changes to get the linter passing (mostly autofix). How --- Update eslint-config-prettier and eslint-plugin-prettier. To address deprecation warnings, also update typescript-eslint/parser and typescript-eslint/eslint-plugin. Because of an update to typescript-eslint/parser, we need to suppress deprecation warnings (documented in a comment). Regenerated test snapshots. Due to the upgraded dependencies, typecasts and optional chaining are now auto-fixable by lint. This converts warnings into autofixes. Test Plan --- `yarn test` in the linter config. Run `expotools check --all --fix-lint --no-build --no-test --no-uniformity-check` to try this config on the whole repo. --------- Co-authored-by: Expo Bot <34669131+expo-bot@users.noreply.github.com> List of files: /expo/packages/@expo/cli/src/start/server/metro/withMetroMultiPlatform.ts

8816be9a - Always apply custom Metro resolver in Expo CLI. (#23784)

Mon, 31 Jul 2023 19:04:39 +0000

Always apply custom Metro resolver in Expo CLI. (#23784)# Why - mjs resolver must always be applied. - There are probably other side effects but everything is getting more test coverage this way. --------- Co-authored-by: Expo Bot <34669131+expo-bot@users.noreply.github.com> List of files: /expo/packages/@expo/cli/src/start/server/metro/withMetroMultiPlatform.ts

4e5f28ee - feat(metro): support mjs extensions in Expo (#23528)

Sat, 29 Jul 2023 17:54:23 +0000

feat(metro): support mjs extensions in Expo (#23528)# Why - A number of libraries are using this file, unclear how we should use it though. - This PR doesn't enable `unstable_packageExports` but it does pull in the default `unstable_conditionNames` from the recommended react-native metro config. - mjs is resolved after js/ts files when bundling for Node.js environments. # Test Plan - Expo Camera works in Expo Router on web. - Added tests for continuous functionality. # Checklist - [ ] Documentation is up to date to reflect these changes (eg: https://docs.expo.dev and README.md). - [ ] Conforms with the [Documentation Writing Style Guide](https://github.com/expo/expo/blob/main/guides/Expo%20Documentation%20Writing%20Style%20Guide.md) - [ ] This diff will work correctly for `npx expo prebuild` & EAS Build (eg: updated a module plugin). --------- Co-authored-by: Expo Bot <34669131+expo-bot@users.noreply.github.com> List of files: /expo/packages/@expo/cli/src/start/server/metro/withMetroMultiPlatform.ts

2fbedb18 - feat(cli, metro): add inverse import error stack (#23551)

Fri, 28 Jul 2023 03:48:35 +0000

feat(cli, metro): add inverse import error stack (#23551)# Why Many users encounter issues where a library reaches into react-native internals on web and the error isn't helpful. This PR creates a graph of resolutions to print the full stack of imports that lead to an invalid resolution. This helps show which application code can be modified to fix a bug. Unclear if we want to add an experimental version of this in Expo CLI or in Metro. For now, I'm opening the draft so some power-users can pull the branch and use it to debug their projects. I'll be splitting parts of this PR out and merging them into upstream (expo/expo) in the meantime. ### Before ### After ## Usage in dev - Pull this branch - [Setup local CLI in dev](https://github.com/expo/expo/blob/main/packages/%40expo/cli/README.md#contributing). - Start your project with local CLI in dev. # Test Plan - TBD --------- Co-authored-by: Expo Bot <34669131+expo-bot@users.noreply.github.com> List of files: /expo/packages/@expo/cli/src/start/server/metro/withMetroMultiPlatform.ts

11c2de32 - Fix tsconfig paths and other SDK 49 Metro features. (#23276)

Mon, 03 Jul 2023 19:48:26 +0000

Fix tsconfig paths and other SDK 49 Metro features. (#23276)# Why We install an additional metro config modification **after** loading the metro config, this additional function adds dynamic functionality like listening for tsconfig changes. This wasn't being added to the expo-updates metro config which resulted in tsconfig paths not working. # How # Test Plan - Ran locally with `npx expo run:ios --configuration Release` # Checklist - [ ] Documentation is up to date to reflect these changes (eg: https://docs.expo.dev and README.md). - [ ] Conforms with the [Documentation Writing Style Guide](https://github.com/expo/expo/blob/main/guides/Expo%20Documentation%20Writing%20Style%20Guide.md) - [ ] This diff will work correctly for `npx expo prebuild` & EAS Build (eg: updated a module plugin). --------- Co-authored-by: Expo Bot <34669131+expo-bot@users.noreply.github.com> List of files: /expo/packages/@expo/cli/src/start/server/metro/withMetroMultiPlatform.ts

da5824c9 - [cli] fix typecheck from react-native 0.72 upgrade (#22766)

Mon, 12 Jun 2023 17:32:30 +0000

[cli] fix typecheck from react-native 0.72 upgrade (#22766)# Why follow up #22588 which disabled the cli typecheck # How using types from metro and fix typing issues # Test Plan cli ci passed List of files: /expo/packages/@expo/cli/src/start/server/metro/withMetroMultiPlatform.ts

8010f0ca - feat(cli,router): support src/app directory in Expo Router (#22748)

Sat, 10 Jun 2023 05:48:57 +0000

feat(cli,router): support src/app directory in Expo Router (#22748)# Why - related https://github.com/expo/router/pull/629 # How # Test Plan # Checklist - [ ] Documentation is up to date to reflect these changes (eg: https://docs.expo.dev and README.md). - [ ] Conforms with the [Documentation Writing Style Guide](https://github.com/expo/expo/blob/main/guides/Expo%20Documentation%20Writing%20Style%20Guide.md) - [ ] This diff will work correctly for `npx expo prebuild` & EAS Build (eg: updated a module plugin). --------- Co-authored-by: Expo Bot <34669131+expo-bot@users.noreply.github.com> List of files: /expo/packages/@expo/cli/src/start/server/metro/withMetroMultiPlatform.ts

9580591f - feat(metro-config, cli): CSS serializer (#22325)

Sun, 30 Apr 2023 20:46:17 +0000

feat(metro-config, cli): CSS serializer (#22325)# Why In order to support static CSS in development mode, we need to update the metro serializer to support returning the JS and CSS assets. We now inline the CSS in the HTML before sending to the client, this allows for testing how the website works with JS disabled. We use the same style tag id to continue to support HMR for styles during subsequent updates. This change also refactors how exports work to serialize JS and CSS at the same time (i.e. after the native transformations). # How # Test Plan # Checklist - [ ] Documentation is up to date to reflect these changes (eg: https://docs.expo.dev and README.md). - [ ] Conforms with the [Documentation Writing Style Guide](https://github.com/expo/expo/blob/main/guides/Expo%20Documentation%20Writing%20Style%20Guide.md) - [ ] This diff will work correctly for `npx expo prebuild` & EAS Build (eg: updated a module plugin). --------- Co-authored-by: Expo Bot <34669131+expo-bot@users.noreply.github.com> List of files: /expo/packages/@expo/cli/src/start/server/metro/withMetroMultiPlatform.ts

6a750d06 - feat(cli, metro-config): environment variable support (#21983)

Sat, 08 Apr 2023 03:37:17 +0000

feat(cli, metro-config): environment variable support (#21983)# Why - It's nice to be able to use uncommitted values in your app, based on the environment. This feels very familiar to web developers. - Values that are prefixed with `EXPO_PUBLIC_` will be inlined in the bundle when bundling normally (e.g. not for Node.js). - `.env` files are loaded into memory and applied to the process during a run. This also means that they're available in `app.config.js`. - During development-only, environment variables are exposed on the `process.env` object (non-enumerable) to ensure they're available between fast refresh updates. # How - Create new package `@expo/env` which is used to hydrate env variables in a unified way. I plan to open another PR in `eas-cli` which uses this package to fill in environment variables before uploading. NOTE: environment variables that are defined in eas.json are not available in Expo CLI when building locally, but are available in the cloud since they'll be on the process, this means they effectively emulate `.env.production`. - Update templates to gitignore local env files. - Add basic documentation to the versioned metro guide (more to come). # Test Plan - [ ] E2E rendering test - [ ] E2E Node.js rendering test - [x] Unit tests for serializer - [x] Tests for env package # Checklist - [ ] Documentation is up to date to reflect these changes (eg: https://docs.expo.dev and README.md). - [ ] Conforms with the [Documentation Writing Style Guide](https://github.com/expo/expo/blob/main/guides/Expo%20Documentation%20Writing%20Style%20Guide.md) - [ ] This diff will work correctly for `expo prebuild` & EAS Build (eg: updated a module plugin). List of files: /expo/packages/@expo/cli/src/start/server/metro/withMetroMultiPlatform.ts

81bb50eb - Fix main field resolution for metro web. (#21939)

Sat, 01 Apr 2023 18:29:14 +0000

Fix main field resolution for metro web. (#21939)# Why i broke the logic # How # Test Plan # Checklist - [ ] Documentation is up to date to reflect these changes (eg: https://docs.expo.dev and README.md). - [ ] Conforms with the [Documentation Writing Style Guide](https://github.com/expo/expo/blob/main/guides/Expo%20Documentation%20Writing%20Style%20Guide.md) - [ ] This diff will work correctly for `expo prebuild` & EAS Build (eg: updated a module plugin). --------- Co-authored-by: Expo Bot <34669131+expo-bot@users.noreply.github.com> List of files: /expo/packages/@expo/cli/src/start/server/metro/withMetroMultiPlatform.ts

f479be69 - chore(cli): switch `EXPO_USE_PATH_ALIASES` to `expo.experiments.tsconfigPaths`. (#21897)

Thu, 30 Mar 2023 03:10:43 +0000

chore(cli): switch `EXPO_USE_PATH_ALIASES` to `expo.experiments.tsconfigPaths`. (#21897)# Why - It's a bit harder to set env vars and users will want this either always on or always off. - Expo Config makes it easier to deprecate values on a per-version basis. https://github.com/expo/universe/pull/11872 - Comment out references to the path aliases feature until we're closer to launch. Users are getting confused when they see the feature documented. --------- Co-authored-by: Expo Bot <34669131+expo-bot@users.noreply.github.com> List of files: /expo/packages/@expo/cli/src/start/server/metro/withMetroMultiPlatform.ts

57eba0f9 - feat(cli): add node target and externals to Metro (#21886)

Wed, 29 Mar 2023 22:27:23 +0000

feat(cli): add node target and externals to Metro (#21886)# Why In order to bundle for Node.js targets using Metro (required for React Server Components and other features), we need to add support for leaving the Node.js imports in-tact (no first-class support), and the ability to indicate that we're targeting Node.js without changing the platform from web. # How - Use `resolver.environment` and `transform.environment` to partially invalidate the Metro cache and pass custom options to the transformer (usage currently unimplemented) and resolver. - Tap Node.js files in the user project under `.expo/metro/externals/[module]/index.js` and redirect requests to these modules when bundling for Node.js environments. - Tap a polyfill which exposes `$$require_external` on the global. `$$require_external` can be used to access the environment require from anywhere in the bundle. - `$$require_external` asserts when used in the browser or native (where it shouldn't be available). # Test Plan - Added unit tests. - Tested against an Expo Router project. # Checklist - [ ] Documentation is up to date to reflect these changes (eg: https://docs.expo.dev and README.md). - [ ] Conforms with the [Documentation Writing Style Guide](https://github.com/expo/expo/blob/main/guides/Expo%20Documentation%20Writing%20Style%20Guide.md) - [ ] This diff will work correctly for `expo prebuild` & EAS Build (eg: updated a module plugin). --------- Co-authored-by: Expo Bot <34669131+expo-bot@users.noreply.github.com> List of files: /expo/packages/@expo/cli/src/start/server/metro/withMetroMultiPlatform.ts

0a6ddb20 - feat(cli): add basic static rendering for router projects (#21572)

Mon, 13 Mar 2023 15:57:58 +0000

feat(cli): add basic static rendering for router projects (#21572)# Why - Implement an experimental static rendering system for Metro websites using Expo Router. - Behavior is undocumented and highly experimental. # How - Add support to `start` and `export` which pre-renders static web pages to HTML to improve SEO support on web. - The system implements [React Navigation's SSR](https://reactnavigation.org/docs/server-rendering) support. - Head elements can be used with `import { Head } from 'expo-router/head'`. - The root HTML is not exposed to the user. - There are no data fetching mechanisms. - There's no ability to provide a 404 page or other server features. # Test Plan - e2e test for exporting a router project statically. - `EXPO_USE_STATIC=1 yarn expo` -> websites are pre-rendered before being served. - `EXPO_USE_STATIC=1 yarn expo export -p web` -> static routes are rendered to static HTML files by the same name (dynamic routes are not supported). # Checklist - [ ] Documentation is up to date to reflect these changes (eg: https://docs.expo.dev and README.md). - [ ] Conforms with the [Documentation Writing Style Guide](https://github.com/expo/expo/blob/main/guides/Expo%20Documentation%20Writing%20Style%20Guide.md) - [ ] This diff will work correctly for `expo prebuild` & EAS Build (eg: updated a module plugin). --------- Co-authored-by: Expo Bot <34669131+expo-bot@users.noreply.github.com> List of files: /expo/packages/@expo/cli/src/start/server/metro/withMetroMultiPlatform.ts

d8009c4b - feat(cli): add support for path aliases and absolute imports (#21262)

Fri, 24 Feb 2023 18:20:14 +0000

feat(cli): add support for path aliases and absolute imports (#21262)# Why - In Expo Router, you have to import outside of the `app` directory which does not spark joy at scale (e.g. `../../../../../../`). - This is pretty standard functionality in web development, feels odd not having it in our "Metro for web" system. # How - Add support for `compilerOptions.baseUrl` from `tsconfig.json` and `jsconfig.json` files to Metro. This enables absolute imports. - Add support for `compilerOptions.paths` aliases from `tsconfig.json` and `jsconfig.json` files to Metro. This enables path aliases. Tried to keep the implementation as close to TypeScript as possible to reduce maintenance. - Absolute imports utilize built-in Metro behavior making it more reliable. We basically just register the baseUrl as a location to search for node modules. - Couldn't decide where to document the feature so I put it in multiple places. - We might need to update expo jest to have similar functionality in the future (it might already support these fields, didn't check). # Test Plan - Added some unit tests for path aliases (non-exhaustive). - For correctness, you can use this feature in vscode and all autocomplete suggestions should work as the bundling now matches the built-in resolution. # Checklist - [ ] Documentation is up to date to reflect these changes (eg: https://docs.expo.dev and README.md). - [ ] Conforms with the [Documentation Writing Style Guide](https://github.com/expo/expo/blob/main/guides/Expo%20Documentation%20Writing%20Style%20Guide.md) - [ ] This diff will work correctly for `expo prebuild` & EAS Build (eg: updated a module plugin). --------- Co-authored-by: Expo Bot <34669131+expo-bot@users.noreply.github.com> List of files: /expo/packages/@expo/cli/src/start/server/metro/withMetroMultiPlatform.ts

96b83276 - fix(cli): add react-native-web alias for metro web that doesn't rely on Babel (#20828)

Fri, 13 Jan 2023 16:00:18 +0000

fix(cli): add react-native-web alias for metro web that doesn't rely on Babel (#20828)# Why - If you disable Babel (e.g. in exotic mode) then the fallback system doesn't work (it effectively never "works"). # How - Simply remap `react-native` to `react-native-web` when resolving for the web. # Test Plan `EXPO_USE_EXOTIC=1 nexpo -c -w` -> Works (never attempts to access `react-native/index.js`) Co-authored-by: Expo Bot <34669131+expo-bot@users.noreply.github.com> List of files: /expo/packages/@expo/cli/src/start/server/metro/withMetroMultiPlatform.ts

837127ed - fix(cli): allow chained Metro resolvers to resolve when the predecessor resolvers throw a Metro resolution error. (#20704)

Wed, 04 Jan 2023 16:26:21 +0000

fix(cli): allow chained Metro resolvers to resolve when the predecessor resolvers throw a Metro resolution error. (#20704)# Why Reimplements #19874 but with tests and proper checking. # How - When a metro resolver throws a metro resolution error, we should attempt to resolve using the next resolver in the chain. - Added debug logs so users can examine the progress. - Added tests for all known cases. Co-authored-by: Expo Bot <34669131+expo-bot@users.noreply.github.com> List of files: /expo/packages/@expo/cli/src/start/server/metro/withMetroMultiPlatform.ts

bc774956 - Fix web assets not loading in Metro for web on Windows (#19935)

Tue, 08 Nov 2022 20:30:36 +0000

Fix web assets not loading in Metro for web on Windows (#19935)* Fix web assets not loading in Metro for web on Windows * Update packages/@expo/cli/CHANGELOG.md Co-authored-by: Expo Bot <34669131+expo-bot@users.noreply.github.com> Co-authored-by: Expo Bot <34669131+expo-bot@users.noreply.github.com> List of files: /expo/packages/@expo/cli/src/start/server/metro/withMetroMultiPlatform.ts