metro-react-native-babel-preset
Advanced tools
Babel presets for React Native applications. React Native itself uses this Babel preset by default when transforming your app's source code.
If you wish to use a custom Babel configuration by writing a babel.config.js file in your project's root directory, you must specify all the plugins necessary to transform your code. React Native does not apply its default Babel configuration in this case. So, to make your life easier, you can use this preset to get the default configuration and then specify more plugins that run before it.
As mentioned above, you only need to use this preset if you are writing a custom babel.config.js file.
Install metro-react-native-babel-preset in your app:
with npm:
npm i metro-react-native-babel-preset --save-dev
or with yarn:
yarn add -D metro-react-native-babel-preset
Then, create a file called babel.config.js in your project's root directory. The existence of this babel.config.js file will tell React Native to use your custom Babel configuration instead of its own. Then load this preset:
{
"presets": ["module:metro-react-native-babel-preset"]
}
You can further customize your Babel configuration by specifying plugins and other options. See Babel's babel.config.js documentation to learn more.
If you get stuck configuring Babel, please ask a question on Stack Overflow or find a consultant for help. If you discover a bug, please open up an issue.
The @babel/preset-env package is a widely-used Babel preset that allows developers to use the latest JavaScript features without worrying about browser compatibility. It is similar to metro-react-native-babel-preset in that it handles modern JavaScript features, but it is targeted towards web development rather than React Native.
The @babel/preset-react package is a Babel preset specifically for React applications. It includes plugins that transform JSX and other React-specific syntax. It is similar to metro-react-native-babel-preset, but it does not include React Native-specific transformations and optimizations.
The babel-preset-expo package is a Babel preset for Expo apps, which are built on top of React Native. It extends metro-react-native-babel-preset with additional Expo-specific configurations and plugins. It is similar but tailored for the Expo ecosystem.
FAQs
Babel preset for React Native applications
The npm package metro-react-native-babel-preset receives a total of 855,380 weekly downloads. As such, metro-react-native-babel-preset popularity was classified as popular.
We found that metro-react-native-babel-preset demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 2 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Product
A single platform for static analysis, secrets detection, container scanning, and CVE checks—built on trusted open source tools, ready to run out of the box.
Product
Socket is launching experimental protection for the Hugging Face ecosystem, scanning for malware and malicious payload injections inside model files to prevent silent AI supply chain attacks.
Research
/Security News
The Socket Threat Research Team uncovered a coordinated campaign that floods the Chrome Web Store with 131 rebranded clones of a WhatsApp Web automation extension to spam Brazilian users.