From 54ca489c26819879c7095bb075dc3ea0d73f6082 Mon Sep 17 00:00:00 2001 From: Tore Hammervoll Date: Wed, 24 Apr 2019 14:14:13 +0200 Subject: [PATCH 1/2] Update dependencies preset to support browserslist --- packages/babel-preset-react-app/dependencies.js | 16 +++++----------- 1 file changed, 5 insertions(+), 11 deletions(-) diff --git a/packages/babel-preset-react-app/dependencies.js b/packages/babel-preset-react-app/dependencies.js index 60c76fb5b3a..d5b98cc688f 100644 --- a/packages/babel-preset-react-app/dependencies.js +++ b/packages/babel-preset-react-app/dependencies.js @@ -84,17 +84,11 @@ module.exports = function(api, opts) { // Latest stable ECMAScript features require('@babel/preset-env').default, { - // We want Create React App to be IE 9 compatible until React itself - // no longer works with IE 9 - targets: { - ie: 9, - }, - // Users cannot override this behavior because this Babel - // configuration is highly tuned for ES5 support - ignoreBrowserslistConfig: true, - // If users import all core-js they're probably not concerned with - // bundle size. We shouldn't rely on magic to try and shrink it. - useBuiltIns: false, + // Allow importing core-js in entrypoint and use browserlist to select polyfills + useBuiltIns: 'entry', + // Set the corejs version we are using to avoid warnings in console + // This will need to change once we upgrade to corejs@3 + corejs: 3, // Do not transform modules to CJS modules: false, // Exclude transforms that make all code slower From 6bb900e39973cd28fdda47534159fc76a23eb897 Mon Sep 17 00:00:00 2001 From: Tore Hammervoll Date: Wed, 24 Apr 2019 14:15:55 +0200 Subject: [PATCH 2/2] Loose mode array destructuring for hooks in dependencies --- .../babel-preset-react-app/dependencies.js | 23 +++++++++++++++++++ 1 file changed, 23 insertions(+) diff --git a/packages/babel-preset-react-app/dependencies.js b/packages/babel-preset-react-app/dependencies.js index d5b98cc688f..86902d36bee 100644 --- a/packages/babel-preset-react-app/dependencies.js +++ b/packages/babel-preset-react-app/dependencies.js @@ -97,6 +97,29 @@ module.exports = function(api, opts) { ], ].filter(Boolean), plugins: [ + // Necessary to include regardless of the environment because + // in practice some other transforms (such as object-rest-spread) + // don't work without it: https://github.com/babel/babel/issues/7215 + [ + require('@babel/plugin-transform-destructuring').default, + { + // Use loose mode for performance: + // https://github.com/facebook/create-react-app/issues/5602 + loose: false, + selectiveLoose: [ + 'useState', + 'useEffect', + 'useContext', + 'useReducer', + 'useCallback', + 'useMemo', + 'useRef', + 'useImperativeHandle', + 'useLayoutEffect', + 'useDebugValue', + ], + }, + ], // Polyfills the runtime needed for async/await, generators, and friends // https://babeljs.io/docs/en/babel-plugin-transform-runtime [