React webpack config for dev and production build

webpack.config.js

const { join, resolve } = require('path')
const { main } = require(join(__dirname, 'package.json'))
const TerserPlugin = require('terser-webpack-plugin')

const rules = [
    {
        test: /\.(js|jsx)$/,
        loader: 'babel-loader',
    },
    {
        test: /\.css$/,
        use: ['style-loader', 'css-loader']
    }
]

const production = {
    mode: 'production',
    entry: [
        join(__dirname, main),
    ],
    output: {
        filename: 'procedimento.[hash].min.js',
        library: 'procedimento',
    },
    module: {
        rules: rules,
    },
    optimization: {
        minimize: true,
        minimizer: [new TerserPlugin({
            extractComments: false,
            terserOptions: {
                output: {
                    comments: false,
                }
            },
            sourceMap: true
        })],
    },
}

const development = {
    name: 'dev',
    mode: 'development',
    entry: [
        join(__dirname, 'src/index.js'),
    ],
    module: {
        rules: rules,
    },
    output: {
        path: join(__dirname, 'public'),
        filename: 'main.js',
    },
    devServer: {
        hot: true,
        contentBase: join(__dirname, 'public'),
    }
}

const configs = {
    production: production,
    development: development,
}

module.exports = (env, argv) => {
    return configs[argv.mode]
}