-
-
Save karanjthakkar/3241808022a75d8068f35a33b57e90c5 to your computer and use it in GitHub Desktop.
React Native babel config for JSC v236355.1.1 and Metro v0.53
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
const lazyImports = require('metro-react-native-babel-preset/src/configs/lazy-imports'); | |
module.exports = (api) => { | |
api.cache(true); | |
return { | |
comments: false, | |
compact: true, | |
plugins: [ | |
'@babel/plugin-transform-flow-strip-types', | |
'@babel/plugin-proposal-optional-catch-binding', | |
// SUPPORTED BY DEFAULT: '@babel/plugin-transform-block-scoping', | |
['@babel/plugin-proposal-class-properties', { | |
loose: true, | |
}], | |
'@babel/plugin-syntax-dynamic-import', | |
'@babel/plugin-syntax-export-default-from', | |
// SUPPORTED BY DEFAULT: '@babel/plugin-transform-computed-properties', | |
// SUPPORTED BY DEFAULT: '@babel/plugin-transform-destructuring', | |
// SUPPORTED BY DEFAULT: '@babel/plugin-transform-function-name', | |
// SUPPORTED BY DEFAULT: '@babel/plugin-transform-literals', | |
// SUPPORTED BY DEFAULT: '@babel/plugin-transform-parameters', | |
// SUPPORTED BY DEFAULT: '@babel/plugin-transform-shorthand-properties', | |
'@babel/plugin-transform-react-jsx', | |
// SUPPORTED BY DEFAULT: '@babel/plugin-transform-regenerator', | |
'@babel/plugin-transform-sticky-regex', | |
'@babel/plugin-transform-unicode-regex', | |
'@babel/plugin-proposal-export-default-from', | |
[ | |
'@babel/plugin-transform-modules-commonjs', | |
{ | |
strict: false, | |
strictMode: false, // prevent "use strict" injections | |
lazy: importSpecifier => lazyImports.has(importSpecifier), | |
allowTopLevelThis: true, // dont rewrite global `this` -> `undefined` | |
}, | |
], | |
// SUPPORTED BY DEFAULT: '@babel/plugin-transform-classes', | |
// SUPPORTED BY DEFAULT: '@babel/plugin-transform-arrow-functions' | |
// SUPPORTED BY DEFAULT: '@babel/plugin-transform-spread', | |
'@babel/plugin-proposal-object-rest-spread', | |
// SUPPORTED BY DEFAULT: [ | |
// SUPPORTED BY DEFAULT: '@babel/plugin-transform-template-literals', | |
// SUPPORTED BY DEFAULT: {loose: true}, // dont 'a'.concat('b'), just use 'a'+'b' | |
// SUPPORTED BY DEFAULT: ], | |
// SUPPORTED BY DEFAULT: '@babel/plugin-transform-exponentiation-operator', | |
// SUPPORTED BY DEFAULT: '@babel/plugin-transform-object-assign', | |
// SUPPORTED BY DEFAULT: ['@babel/plugin-transform-for-of', {loose: true}], | |
'metro-react-native-babel-preset/src/transforms/transform-symbol-member', | |
'@babel/plugin-transform-react-display-name', | |
'@babel/plugin-proposal-optional-chaining', | |
'@babel/plugin-proposal-nullish-coalescing-operator', | |
['@babel/plugin-transform-runtime', { | |
helpers: true, | |
regenerator: true, | |
}], | |
], | |
}; | |
}; |
I've been busting my head trying to get the **
operator and BigInts to work on react-native-macos for a couple days constantly getting TypeError: Cannot convert a BigInt value to a number
This gist saved my life. I really really really appreciate you
I had to comment out the transform-symbol-member
line as well to make it work
Also for others trying this remember that the bundler runs from a cache so restart using npm
or yarn
:
npm start -- --reset-cache
Also typescript was bugging out with these changes. Things like the as
operator named tuples
, etc. weren't working. Making the following mod to babel.config.js
fixed things:
presets: [
'@babel/preset-typescript'
]
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
have you had any issues using this
babel.config.js
for the new RN 0.59?