From c92efca0816ea64abd2f39d91ccea7fb3fb73d68 Mon Sep 17 00:00:00 2001 From: Ian Sutherland Date: Thu, 27 Sep 2018 12:43:34 -0600 Subject: [PATCH 1/6] Switch back to babel-loader --- packages/babel-preset-react-app/loader.js | 27 ++++++++++++++-- packages/babel-preset-react-app/overrides.js | 32 ------------------- packages/babel-preset-react-app/package.json | 3 +- packages/react-error-overlay/package.json | 2 +- .../config/webpack.config.dev.js | 6 ++-- .../config/webpack.config.prod.js | 3 +- packages/react-scripts/package.json | 2 +- 7 files changed, 31 insertions(+), 44 deletions(-) delete mode 100644 packages/babel-preset-react-app/overrides.js diff --git a/packages/babel-preset-react-app/loader.js b/packages/babel-preset-react-app/loader.js index da11ea80cce..8b371b63908 100644 --- a/packages/babel-preset-react-app/loader.js +++ b/packages/babel-preset-react-app/loader.js @@ -6,7 +6,28 @@ */ 'use strict'; -const loader = require('babel-loader'); -const overrides = require('./overrides'); +const crypto = require('crypto'); -module.exports = loader.custom(() => overrides); +module.exports = function() { + return { + // This function transforms the Babel configuration on a per-file basis + config(config, { source }) { + // Babel Macros are notoriously hard to cache, so they shouldn't be + // https://github.com/babel/babel/issues/8497 + // We naively detect macros using their package suffix and insert a random + // caller name, a valid option accepted by Babel, to compose a one-time + // cacheIdentifier for the file. We cannot tune the loader options on a per + // file basis. + if (source.indexOf('.macro') !== -1 || source.indexOf('/macro') !== -1) { + return { + ...config.options, + caller: { + name: 'babel-preset-react-app', + craInvalidationToken: crypto.randomBytes(32).toString('hex'), + }, + }; + } + return config.options; + }, + }; +}; diff --git a/packages/babel-preset-react-app/overrides.js b/packages/babel-preset-react-app/overrides.js deleted file mode 100644 index 1613983b370..00000000000 --- a/packages/babel-preset-react-app/overrides.js +++ /dev/null @@ -1,32 +0,0 @@ -/** - * Copyright (c) 2015-present, Facebook, Inc. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - */ -'use strict'; - -const crypto = require('crypto'); - -module.exports = { - // This function transforms the Babel configuration on a per-file basis - config(config, { source }) { - // Babel Macros are notoriously hard to cache, so they shouldn't be - // https://github.com/babel/babel/issues/8497 - // We naively detect macros using their package suffix and insert a random - // caller name, a valid option accepted by Babel, to compose a one-time - // cacheIdentifier for the file. We cannot tune the loader options on a per - // file basis. - if (source.indexOf('.macro') !== -1 || source.indexOf('/macro') !== -1) { - return { - ...config.options, - caller: { - name: `babel-preset-react-app:${crypto - .randomBytes(32) - .toString('hex')}`, - }, - }; - } - return config.options; - }, -}; diff --git a/packages/babel-preset-react-app/package.json b/packages/babel-preset-react-app/package.json index 4bb3240a90c..245a87b57a8 100644 --- a/packages/babel-preset-react-app/package.json +++ b/packages/babel-preset-react-app/package.json @@ -13,7 +13,6 @@ "dev.js", "index.js", "loader.js", - "overrides.js", "prod.js", "test.js" ], @@ -31,7 +30,7 @@ "@babel/preset-flow": "7.0.0", "@babel/preset-react": "7.0.0", "@babel/runtime": "7.0.0", - "babel-loader": "8.0.2", + "babel-loader": "8.0.4", "babel-plugin-macros": "2.4.2", "babel-plugin-transform-dynamic-import": "2.1.0", "babel-plugin-transform-react-remove-prop-types": "0.4.18" diff --git a/packages/react-error-overlay/package.json b/packages/react-error-overlay/package.json index c08a2cfb41f..2f86355e12a 100644 --- a/packages/react-error-overlay/package.json +++ b/packages/react-error-overlay/package.json @@ -36,7 +36,7 @@ "babel-core": "7.0.0-bridge.0", "babel-eslint": "9.0.0", "babel-jest": "23.6.0", - "babel-loader": "8.0.2", + "babel-loader": "8.0.4", "babel-preset-react-app": "^4.0.0", "chalk": "^2.3.2", "chokidar": "^2.0.2", diff --git a/packages/react-scripts/config/webpack.config.dev.js b/packages/react-scripts/config/webpack.config.dev.js index ab54cc33cf2..6a146b47eeb 100644 --- a/packages/react-scripts/config/webpack.config.dev.js +++ b/packages/react-scripts/config/webpack.config.dev.js @@ -218,11 +218,9 @@ module.exports = { }, }, { - // We need to use our own loader until `babel-loader` supports - // customization - // https://github.com/babel/babel-loader/pull/687 - loader: require.resolve('babel-preset-react-app/loader'), + loader: require.resolve('babel-loader'), options: { + customize: require.resolve('babel-preset-react-app/loader'), // @remove-on-eject-begin babelrc: false, configFile: false, diff --git a/packages/react-scripts/config/webpack.config.prod.js b/packages/react-scripts/config/webpack.config.prod.js index fe92a483883..835cb80182f 100644 --- a/packages/react-scripts/config/webpack.config.prod.js +++ b/packages/react-scripts/config/webpack.config.prod.js @@ -272,8 +272,9 @@ module.exports = { // We need to use our own loader until `babel-loader` supports // customization // https://github.com/babel/babel-loader/pull/687 - loader: require.resolve('babel-preset-react-app/loader'), + loader: require.resolve('babel-loader'), options: { + customize: require.resolve('babel-preset-react-app/loader'), // @remove-on-eject-begin babelrc: false, configFile: false, diff --git a/packages/react-scripts/package.json b/packages/react-scripts/package.json index d05871696de..f5a82071b4d 100644 --- a/packages/react-scripts/package.json +++ b/packages/react-scripts/package.json @@ -26,7 +26,7 @@ "babel-core": "7.0.0-bridge.0", "babel-eslint": "9.0.0", "babel-jest": "23.6.0", - "babel-loader": "8.0.2", + "babel-loader": "8.0.4", "babel-plugin-named-asset-import": "^0.2.0", "babel-preset-react-app": "^4.0.0", "bfj": "6.1.1", From fcfecca645a2752f671dfa541bfe87887b0289f8 Mon Sep 17 00:00:00 2001 From: Ian Sutherland Date: Thu, 27 Sep 2018 15:09:17 -0600 Subject: [PATCH 2/6] Preserve existing caller options. Use Object.assign instead of object spread. --- .../{loader.js => webpack-overrides.js} | 10 ++++------ packages/react-scripts/config/webpack.config.dev.js | 4 +++- packages/react-scripts/config/webpack.config.prod.js | 4 +++- 3 files changed, 10 insertions(+), 8 deletions(-) rename packages/babel-preset-react-app/{loader.js => webpack-overrides.js} (87%) diff --git a/packages/babel-preset-react-app/loader.js b/packages/babel-preset-react-app/webpack-overrides.js similarity index 87% rename from packages/babel-preset-react-app/loader.js rename to packages/babel-preset-react-app/webpack-overrides.js index 8b371b63908..c739a204f51 100644 --- a/packages/babel-preset-react-app/loader.js +++ b/packages/babel-preset-react-app/webpack-overrides.js @@ -19,13 +19,11 @@ module.exports = function() { // cacheIdentifier for the file. We cannot tune the loader options on a per // file basis. if (source.indexOf('.macro') !== -1 || source.indexOf('/macro') !== -1) { - return { - ...config.options, - caller: { - name: 'babel-preset-react-app', + return Object.assign({}, config.options, { + caller: Object.assign({}, config.options.caller, { craInvalidationToken: crypto.randomBytes(32).toString('hex'), - }, - }; + }), + }); } return config.options; }, diff --git a/packages/react-scripts/config/webpack.config.dev.js b/packages/react-scripts/config/webpack.config.dev.js index 6a146b47eeb..b01fb6a513f 100644 --- a/packages/react-scripts/config/webpack.config.dev.js +++ b/packages/react-scripts/config/webpack.config.dev.js @@ -220,7 +220,9 @@ module.exports = { { loader: require.resolve('babel-loader'), options: { - customize: require.resolve('babel-preset-react-app/loader'), + customize: require.resolve( + 'babel-preset-react-app/webpack-overrides' + ), // @remove-on-eject-begin babelrc: false, configFile: false, diff --git a/packages/react-scripts/config/webpack.config.prod.js b/packages/react-scripts/config/webpack.config.prod.js index 835cb80182f..e728798cf74 100644 --- a/packages/react-scripts/config/webpack.config.prod.js +++ b/packages/react-scripts/config/webpack.config.prod.js @@ -274,7 +274,9 @@ module.exports = { // https://github.com/babel/babel-loader/pull/687 loader: require.resolve('babel-loader'), options: { - customize: require.resolve('babel-preset-react-app/loader'), + customize: require.resolve( + 'babel-preset-react-app/webpack-overrides' + ), // @remove-on-eject-begin babelrc: false, configFile: false, From 0b6ca8a38ca21964bea0db2ad976ad6b08a43205 Mon Sep 17 00:00:00 2001 From: Ian Sutherland Date: Thu, 27 Sep 2018 15:19:12 -0600 Subject: [PATCH 3/6] Updated filename in package.json --- packages/babel-preset-react-app/package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/babel-preset-react-app/package.json b/packages/babel-preset-react-app/package.json index 245a87b57a8..146301525ef 100644 --- a/packages/babel-preset-react-app/package.json +++ b/packages/babel-preset-react-app/package.json @@ -12,7 +12,7 @@ "dependencies.js", "dev.js", "index.js", - "loader.js", + "webpack-overrides.js", "prod.js", "test.js" ], From 95dc22403a81bb88a91142262babf64c2defe0e6 Mon Sep 17 00:00:00 2001 From: Ian Sutherland Date: Thu, 27 Sep 2018 15:29:09 -0600 Subject: [PATCH 4/6] Update comment about cache identifier --- packages/babel-preset-react-app/webpack-overrides.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/babel-preset-react-app/webpack-overrides.js b/packages/babel-preset-react-app/webpack-overrides.js index c739a204f51..22557cdfb1b 100644 --- a/packages/babel-preset-react-app/webpack-overrides.js +++ b/packages/babel-preset-react-app/webpack-overrides.js @@ -14,8 +14,8 @@ module.exports = function() { config(config, { source }) { // Babel Macros are notoriously hard to cache, so they shouldn't be // https://github.com/babel/babel/issues/8497 - // We naively detect macros using their package suffix and insert a random - // caller name, a valid option accepted by Babel, to compose a one-time + // We naively detect macros using their package suffix and add a random token + // to the caller, a valid option accepted by Babel, to compose a one-time // cacheIdentifier for the file. We cannot tune the loader options on a per // file basis. if (source.indexOf('.macro') !== -1 || source.indexOf('/macro') !== -1) { From a9f10a14c0caf278404a66f7fd057f3913b46f1e Mon Sep 17 00:00:00 2001 From: Ian Sutherland Date: Thu, 27 Sep 2018 16:17:48 -0600 Subject: [PATCH 5/6] Update macro check to use a regex --- packages/babel-preset-react-app/webpack-overrides.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/babel-preset-react-app/webpack-overrides.js b/packages/babel-preset-react-app/webpack-overrides.js index 22557cdfb1b..66a501a49e6 100644 --- a/packages/babel-preset-react-app/webpack-overrides.js +++ b/packages/babel-preset-react-app/webpack-overrides.js @@ -18,7 +18,7 @@ module.exports = function() { // to the caller, a valid option accepted by Babel, to compose a one-time // cacheIdentifier for the file. We cannot tune the loader options on a per // file basis. - if (source.indexOf('.macro') !== -1 || source.indexOf('/macro') !== -1) { + if (/[./]macro/.test(source)) { return Object.assign({}, config.options, { caller: Object.assign({}, config.options.caller, { craInvalidationToken: crypto.randomBytes(32).toString('hex'), From d3bc7706feed2f2ebb0d319173cd07c783aed336 Mon Sep 17 00:00:00 2001 From: Ian Sutherland Date: Thu, 27 Sep 2018 16:31:24 -0600 Subject: [PATCH 6/6] Move macro check regex out of function --- packages/babel-preset-react-app/webpack-overrides.js | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/packages/babel-preset-react-app/webpack-overrides.js b/packages/babel-preset-react-app/webpack-overrides.js index 66a501a49e6..95a87eeb66f 100644 --- a/packages/babel-preset-react-app/webpack-overrides.js +++ b/packages/babel-preset-react-app/webpack-overrides.js @@ -8,6 +8,8 @@ const crypto = require('crypto'); +const macroCheck = new RegExp('[./]macro'); + module.exports = function() { return { // This function transforms the Babel configuration on a per-file basis @@ -18,7 +20,7 @@ module.exports = function() { // to the caller, a valid option accepted by Babel, to compose a one-time // cacheIdentifier for the file. We cannot tune the loader options on a per // file basis. - if (/[./]macro/.test(source)) { + if (macroCheck.test(source)) { return Object.assign({}, config.options, { caller: Object.assign({}, config.options.caller, { craInvalidationToken: crypto.randomBytes(32).toString('hex'),