Skip to content

Commit

Permalink
chore(metro-config)!: remove exotic transformer (#27855)
Browse files Browse the repository at this point in the history
# Why

- We deprecated this feature in SDK 50 and now we'll drop all the source
related to it.
- We also pull out the cache key part for `babel-preset-fbjs` since this
is no longer used in metro.
- This PR no longer exports a getCacheKey from the babel transformer
since metro checks the file contents already.

---------

Co-authored-by: Expo Bot <34669131+expo-bot@users.noreply.github.com>
  • Loading branch information
EvanBacon and expo-bot committed Mar 25, 2024
1 parent 4b34b0c commit 47f2028
Show file tree
Hide file tree
Showing 48 changed files with 16 additions and 1,483 deletions.
2 changes: 2 additions & 0 deletions packages/@expo/metro-config/CHANGELOG.md
Expand Up @@ -4,6 +4,8 @@

### 🛠 Breaking changes

- Fully remove "exotic" transformer (`@expo/metro-config/transformer`) in favor of the default Expo transformer. ([#27855](https://github.com/expo/expo/pull/27855) by [@EvanBacon](https://github.com/EvanBacon))

### 🎉 New features

- Add basic `react-server` support. ([#27264](https://github.com/expo/expo/pull/27264) by [@EvanBacon](https://github.com/EvanBacon))
Expand Down
50 changes: 4 additions & 46 deletions packages/@expo/metro-config/README.md
@@ -1,6 +1,6 @@
# `@expo/metro-config`

This package contains the default Metro config that is required for bundling Expo apps.
This package contains the default Metro config that is required for bundling apps with Expo CLI. Refer to the [Expo `metro.config.js` docs](https://docs.expo.dev/versions/latest/config/metro/) to learn more.

`metro.config.js`

Expand All @@ -16,50 +16,8 @@ module.exports = config;

## Exotic

Most of the [Exotic mode](https://blog.expo.dev/drastically-faster-bundling-in-react-native-a54f268e0ed1) performance benefits have been integrated in the default Expo CLI bundling pipeline (e.g. [less AST cloning](https://github.com/facebook/metro/pull/854), [faster worker creation](https://github.com/facebook/metro/pull/856)), and as such, the feature no longer needs to be enabled/disabled. Setting `mode: "exotic"` will no longer have any additional effects over the default.

If you'd like to use different transformers (e.g. Sucrase) for different files, you can still create a custom transformer and refine it for your project needs.

### Custom transformers

> Caution: This is an advanced feature for developers who need to speed up the bundling of very large apps.
You can use `@expo/metro-config/transformer` to create a custom multi-rule transformer. This is useful for running fewer transformations on node modules and speeding up bundling.

`metro.transformer.js`

```js
const { createExoticTransformer } = require('@expo/metro-config/transformer');

module.exports = createExoticTransformer({
transpileModules: ['@stripe/stripe-react-native'],
// You can uncomment the following lines to add any extra node_modules paths in a monorepo:
// nodeModulesPaths: [
// 'node_modules',
// // Generally you'll add this when your config is in `apps/my-app/metro.config.js`
// '../../node_modules',
// // If you have custom packages in a `packages/` folder
// '../../packages',
// ],
});
```

Then use it in your project:
> As of SDK 51, the exotic transformer has been fully removed in favor of the default `@expo/metro-config` transformer. The export `@expo/metro-config/transformer` no longer exists.
`metro.config.js`

```js
const { getDefaultConfig } = require('@expo/metro-config');

const config = getDefaultConfig(__dirname);

// Use the new transformer
config.transformer.babelTransformerPath = require.resolve('./metro.transformer');

// Optionally, you can add support for the `react-native` resolver field back
// doing this will increase bundling time and size as many community packages ship untransformed code using this feature.
// Other packages like `nanoid` use the field to support `react-native` so you may need to enable it regardless.
// defaultConfig.resolver.resolverMainFields.unshift('react-native');
Most of the [Exotic mode](https://blog.expo.dev/drastically-faster-bundling-in-react-native-a54f268e0ed1) performance benefits have been integrated in the default Expo CLI bundling pipeline (e.g. [less AST cloning](https://github.com/facebook/metro/pull/854), [faster worker creation](https://github.com/facebook/metro/pull/856)), and as such, the feature no longer needs to be enabled/disabled. Setting `mode: "exotic"` will no longer have any additional effects over the default.

module.exports = config;
```
Ensure you extend the `@expo/metro-config/babel-transformer` when customizing babel. Learn more: [Extending the Babel transformer](https://docs.expo.dev/versions/latest/config/metro/#extending-the-babel-transformer).
12 changes: 1 addition & 11 deletions packages/@expo/metro-config/build/ExpoMetroConfig.js

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion packages/@expo/metro-config/build/ExpoMetroConfig.js.map

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

0 comments on commit 47f2028

Please sign in to comment.