[JS] Fix webpacker overriding babel config and setting loose

Loose does super dumb shit like converts spread operators to
[].concat() which is broken, incorrect, and not at all helpful.

Because this was forced in their base preset, it would break all
kinds of things that shouldn't have broken, and it would ignore the
project config explicitly.

This seems to fix the vast majority of the JS on the site, and the
generated code makes a lot more sense now.

babel.config.js

@@ -1,63 +1,53 @@
-module.exports = function(api) {
+module.exports = function (api) {
   var validEnv = ['development', 'test', 'production']
   var currentEnv = api.env()
   var isDevelopmentEnv = api.env('development')
   var isProductionEnv = api.env('production')
   var isTestEnv = api.env('test')
+  const { moduleExists } = require('@rails/webpacker')
 
   if (!validEnv.includes(currentEnv)) {
     throw new Error(
       'Please specify a valid `NODE_ENV` or ' +
-        '`BABEL_ENV` environment variables. Valid values are "development", ' +
-        '"test", and "production". Instead, received: ' +
-        JSON.stringify(currentEnv) +
-        '.'
+      '`BABEL_ENV` environment variables. Valid values are "development", ' +
+      '"test", and "production". Instead, received: ' +
+      JSON.stringify(currentEnv) +
+      '.'
     )
   }
 
   return {
     presets: [
-      isTestEnv && [
-        require('@babel/preset-env').default,
+      isTestEnv && ['@babel/preset-env', { targets: { node: 'current' } }],
+      (isProductionEnv || isDevelopmentEnv) && [
+        '@babel/preset-env',
         {
-          targets: {
-            node: 'current'
-          }
+          useBuiltIns: 'entry',
+          corejs: '3.8',
+          modules: 'auto',
+          bugfixes: true,
+          exclude: ['transform-typeof-symbol']
         }
       ],
-      (isProductionEnv || isDevelopmentEnv) && [
-        require('@babel/preset-env').default,
+      moduleExists('@babel/preset-typescript') && [
+        '@babel/preset-typescript',
+        { allExtensions: true, isTSX: true }
+      ],
+      moduleExists('@babel/preset-react') && [
+        '@babel/preset-react',
         {
-          forceAllTransforms: true,
-          useBuiltIns: 'entry',
-          corejs: 3,
-          modules: false,
-          exclude: ['transform-typeof-symbol']
+          development: isDevelopmentEnv || isTestEnv,
+          useBuiltIns: true
         }
       ]
     ].filter(Boolean),
     plugins: [
-      require('babel-plugin-macros'),
-      require('@babel/plugin-syntax-dynamic-import').default,
-      isTestEnv && require('babel-plugin-dynamic-import-node'),
-      require('@babel/plugin-transform-destructuring').default,
-      ["@babel/plugin-proposal-class-properties", { loose: true }],
-      ["@babel/plugin-proposal-private-property-in-object", { "loose": true }],
-      ["@babel/plugin-proposal-private-methods", { "loose": true }],
-      ['@babel/plugin-proposal-object-rest-spread', {useBuiltIns: true}],
-      [
-        require('@babel/plugin-transform-runtime').default,
-        {
-          helpers: false,
-          regenerator: true,
-          corejs: false
-        }
-      ],
-      [
-        require('@babel/plugin-transform-regenerator').default,
-        {
-          async: false
-        }
+      ['@babel/plugin-proposal-class-properties', { loose: true }],
+      ['@babel/plugin-transform-runtime', { helpers: false }],
+      isProductionEnv &&
+      moduleExists('babel-plugin-transform-react-remove-prop-types') && [
+        'babel-plugin-transform-react-remove-prop-types',
+        { removeImport: true }
       ]
     ].filter(Boolean)
   }

package.json

@@ -4,6 +4,7 @@
   "dependencies": {
     "@rails/webpacker": "^6.0.0-rc.5",
     "babel-plugin-macros": "^3.1.0",
+    "core-js": "3.8",
     "css-loader": "^6.3.0",
     "css-minimizer-webpack-plugin": "^3.0.2",
     "jquery-ui": "^1.12.1",
@@ -23,11 +24,6 @@
     "zingtouch": "^1.0.6"
   },
   "version": "0.1.0",
-  "babel": {
-    "presets": [
-      "./node_modules/@rails/webpacker/package/babel/preset.js"
-    ]
-  },
   "devDependencies": {
     "webpack-dev-server": "^4.2.1"
   }

yarn.lock

@@ -1831,6 +1831,11 @@ core-js-compat@^3.14.0, core-js-compat@^3.16.0:
     browserslist "^4.16.7"
     semver "7.0.0"
 
+core-js@3.8:
+  version "3.8.3"
+  resolved "https://registry.yarnpkg.com/core-js/-/core-js-3.8.3.tgz#c21906e1f14f3689f93abcc6e26883550dd92dd0"
+  integrity sha512-KPYXeVZYemC2TkNEkX/01I+7yd+nX3KddKwZ1Ww7SKWdI2wQprSgLmrTddT8nw92AjEklTsPBoSdQBhbI1bQ6Q==
+
 core-util-is@~1.0.0:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/core-util-is/-/core-util-is-1.0.3.tgz#a6042d3634c2b27e9328f837b965fac83808db85"