Build: optimize frontend build configs to improve superset-ui-plugin …

…dev experience (#9326)

* Upgrade webpack, babel and React

* Upgrade all Babel related packages

Also remove babel-plugin-css-modules-transform that is not in use.

* Remvoe tslib as dependency

* Remove unnecesary packages

superset-frontend/babel.config.js

@@ -16,30 +16,36 @@
  * specific language governing permissions and limitations
  * under the License.
  */
+const packageConfig = require('./package.json');
+
 module.exports = {
   sourceMaps: true,
-  sourceType: 'unambiguous',
+  sourceType: 'module',
   retainLines: true,
   presets: [
-    '@babel/preset-react',
     [
       '@babel/preset-env',
       {
         useBuiltIns: 'usage',
         corejs: 3,
         loose: true,
-        shippedProposals: true,
         modules: false,
-        targets: false,
+        shippedProposals: true,
+        targets: packageConfig.browserslist,
       },
     ],
+    [
+      '@babel/preset-react',
+      { development: process.env.BABEL_ENV === 'development' },
+    ],
   ],
   plugins: [
     'lodash',
     '@babel/plugin-syntax-dynamic-import',
     '@babel/plugin-proposal-class-properties',
-    'react-hot-loader/babel',
+    '@babel/plugin-proposal-optional-chaining',
     ['@babel/plugin-transform-runtime', { corejs: 3 }],
+    'react-hot-loader/babel',
   ],
   env: {
     // Setup a different config for tests as they run in node instead of a browser
@@ -52,8 +58,8 @@ module.exports = {
             corejs: 3,
             loose: true,
             shippedProposals: true,
-            targets: { node: 'current' },
             modules: 'commonjs',
+            targets: { node: 'current' },
           },
         ],
       ],

superset-frontend/jest.config.js

@@ -37,6 +37,10 @@ module.exports = {
       diagnostics: {
         warnOnly: true,
       },
+      tsConfig: {
+        jsx: 'react',
+        esModuleInterop: true,
+      },
     },
   },
 };