Source: https://docs.expo.dev/versions/v52.0.0/config/babel

Hide navigation

Search

Ctrl K

Home Guides EAS Reference Learn

Reference version

SDK 52

Archive Expo Snack Discord and Forums Newsletter

babel.config.js

Edit page

Copy page

A reference for Babel configuration file.

Edit page

Copy page

---

Babel is used as the JavaScript compiler to transform modern JavaScript (ES6+) into a version compatible with the JavaScript engine on mobile devices.

Each new Expo project created using npx create-expo-app configures Babel automatically and uses babel-preset-expo as the default preset. There is no need to create a babel.config.js file unless you need to customize the Babel configuration.

1. Navigate to the root of your project and run the following command inside a terminal. This will generate a babel.config.js file in the root of your project.

Terminal

Copy

- npx expo customize babel.config.js

2. The babel.config.js file contains the following default configuration:

babel.config.js

Copy

module.exports = function (api) { api.cache(true); return { presets: ['babel-preset-expo'], }; };

3. If you make a change to the babel.config.js file, you need to restart the Metro bundler to apply the changes and use --clear option from Expo CLI to clear the Metro bundler cache:

Terminal

Copy

- npx expo start --clear

babel-preset-expo

---

babel-preset-expo is the default preset used in Expo projects. It extends the default React Native preset (@react-native/babel-preset) and adds support for decorators, tree-shaking web libraries, and loading font icons.