Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

chore(metro-config)!: remove exotic transformer #27855

Merged
merged 3 commits into from Mar 25, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
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.