Client-side Webpack configuration for development

Update the config object with the following in your webpack.config.client.js file, to configure Webpack for bundling and hot loading React code during development. 

mern-simplesetup/webpack.config.client.js:

const config = {    name: "browser",    mode: "development",    devtool: 'eval-source-map',    entry: [        'react-hot-loader/patch',        'webpack-hot-middleware/client?reload=true',        path.join(CURRENT_WORKING_DIR, 'client/main.js')    ],    output: {        path: path.join(CURRENT_WORKING_DIR , '/dist'),        filename: 'bundle.js',        publicPath: '/dist/'    },    module: {        rules: [            {                test: /\.jsx?$/,                exclude: /node_modules/,                use: [                    'babel-loader'                ]            }        ]    }, plugins: [          new webpack.HotModuleReplacementPlugin(), new webpack.NoEmitOnErrorsPlugin() ...

Get Full-Stack React Projects now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.