Webpack regenerator compile issue for React app

I am trying to package my React app for production as it is a ridiculous size right now on my EC2 server. I am using webpack and I am getting the following compile error:

WARNING in ./src/components/navbar.js 269:34-53
export 'default' (imported as 'React') was not found in 'react' (possible exports: __esModule)
 @ ./src/App.js 24:0-44 1450:42-48
 @ ./src/index.js

WARNING in ./src/components/navbar.js 271:53-72
export 'default' (imported as 'React') was not found in 'react' (possible exports: __esModule)
 @ ./src/App.js 24:0-44 1450:42-48
 @ ./src/index.js

WARNING in ./src/components/navbar.js 276:22-41
export 'default' (imported as 'React') was not found in 'react' (possible exports: __esModule)
 @ ./src/App.js 24:0-44 1450:42-48
 @ ./src/index.js

[...]

WARNING in ./src/methods/context.js 433:11-35
export 'default' (imported as '_regeneratorRuntime') was not found in '@babel/runtime/regenerator' (possible exports: __esModule)
 @ ./src/App.js 57:0-51 2054:10-26
 @ ./src/index.js

WARNING in ./src/methods/history.js 98:63-87
export 'default' (imported as '_regeneratorRuntime') was not found in '@babel/runtime/regenerator' (possible exports: __esModule)
 @ ./src/index.js 11:0-43 13:11-18 15:11-18

WARNING in ./src/methods/history.js 100:29-53
export 'default' (imported as '_regeneratorRuntime') was not found in '@babel/runtime/regenerator' (possible exports: __esModule)
 @ ./src/index.js 11:0-43 13:11-18 15:11-18

WARNING in ./src/methods/history.js 141:64-88
export 'default' (imported as '_regeneratorRuntime') was not found in '@babel/runtime/regenerator' (possible exports: __esModule)
 @ ./src/index.js 11:0-43 13:11-18 15:11-18

WARNING in ./src/methods/history.js 142:29-53
export 'default' (imported as '_regeneratorRuntime') was not found in '@babel/runtime/regenerator' (possible exports: __esModule)
 @ ./src/index.js 11:0-43 13:11-18 15:11-18

WARNING in asset size limit: The following asset(s) exceed the recommended size limit (244 KiB).
This can impact web performance.
Assets:
  index_bundle.js (2.61 MiB)

WARNING in entrypoint size limit: The following entrypoint(s) combined asset size exceeds the recommended limit (244 KiB). This can impact web performance.
Entrypoints:
  main (2.61 MiB)
      index_bundle.js


webpack 5.26.2 compiled with 1713 warnings in 48380 ms

I get this when I run npm run-script webpackbuild which is:

"webpackbuild": "webpack --config webpack.config.js"

I am using a lot of ES6 syntax and I realize on apple systems sometimes certain feature dont work. So I figure this will be killing two birds with one stone. Minimizing and optimizing. This issue is I am unsure what the issue is here. I even tried placing the following at my index.js file

import "core-js/stable";
import "regenerator-runtime/runtime";

Below is my webpack.config.js

const path = require('path');
const webpack = require('webpack');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const regeneratorRuntime = require("regenerator-runtime");


module.exports = {
    entry: "./src/index.js", // The entry point for the application
    output: {
        path: path.join(__dirname, '/dist'),
        filename: 'index_bundle.js' // This will be the created bundle file that webpack creates for react to use in production
    },
    module: {
        rules: [
            { 
                test: /\.js$/, use:'babel-loader'
            },
            {
                test: /\.svg$/, use: 'svg-inline-loader'
            },
            {
                test: /\.css$/, use: [ 'style-loader', 'css-loader' ]
            },
            {
                test: /\.(png|jpe?g|gif)$/i, use: 'file-loader'
            }
        ]
    },
    plugins: [
        new HtmlWebpackPlugin({ template: './public/index.html'}),
        new webpack.ProvidePlugin({
            process: 'process/browser'
        })
    ],
    mode: 'production' // Can be set to development or production. Webpack will minify code and strip warnings
}

Below is my babel.config.js

module.exports = {
    presets: [ "@babel/preset-env", "@babel/preset-react"],
    plugins: [
        [
            "@babel/plugin-proposal-class-properties",
            {
                "loose": true
            }
        ],
        [
            "@babel/plugin-transform-runtime", 
            {
                "asyncGenerators": true,
                "generators": true,
                "async": true
            }
        ],
        ["@babel/plugin-proposal-export-default-from"]
    ]
};

My packages are there in the package.json file so that not the issue. Wondering if anyone can shed light