Menu
I am developing a React-Native app, which was installed using Expo, that creates .babelrc config with this code:
{
"presets": ["babel-preset-expo"],
"env": {
"development": {
"plugins": ["transform-react-jsx-source"]
}
}
}
Recently I have encountered 2 other libraries that require the installation of other types of babel presets named: "react-native" and "flow".
Question: How can I merge 3 presets?
609
@babel/preset-env is a smart preset that allows you to use the latest JavaScript without needing to micromanage which syntax transforms (and optionally, browser polyfills) are needed by your target environment(s). This both makes your life easier and JavaScript bundles smaller!
Simply add a "scripts" field to your package. json and put the babel command inside there as build . This will run Babel the same way as before and the output will be present in lib directory, only now we are using a local copy. Alternatively, you can reference the babel cli inside of node_modules .
The . babelrc file is your local configuration for your code in your project. Generally you would put it in the root of your application repo. It will affect all files that Babel processes that are in the same directory or in sibling directories of the .
Babel is a JavaScript compiler Transform syntax. Polyfill features that are missing in your target environment (through a third-party polyfill such as core-js) Source code transformations (codemods) And more!
add them as items to the array of presets
{
"presets": ["babel-preset-expo","react-native","flow"]
"env": {
"development": {
"plugins": ["transform-react-jsx-source"]
}
}
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
