webpack.config.js

const nodeExternals = require('webpack-node-externals');
const path = require('path');
const srcPath = path.resolve(__dirname, 'src'); //same directory that consist of all the source code. the server app resides here
const distPath = path.resolve(__dirname, 'build'); //same directory created by cra after building the frontend app

module.exports = {
    context: srcPath,
    entry: 'server.js', //name of server file.
    output: {
        path: distPath,
        filename: 'server.js',
        publicPath: '/public/',
    },

    target: 'node', // specifying the target node since we would be running the built script on the server.
    node: {
        __dirname: false,
        __filename: false,
    },
    resolve: {
        modules: ['node_modules', 'src'],
        extensions: ['*', '.js', '.json'],
    },
    module: {
        rules: [
            {
                test: /\.(png|jpg|svg)$/,
                use: {
                    loader: "url-loader",
                    options: {
                        limit: 15000,
                        name: "[name].[ext]",
                    },
                },
            },
            {
                test: /\.js$/,
                exclude: /node_modules/,
                loader: 'babel-loader',
                // babelrc: false,
                query: {
                    presets: [
                        ['env', {
                            targets: {
                                node: 8,
                            },
                        }],
                    ],
                    "plugins": ["transform-object-rest-spread", "dynamic-import-webpack","react-loadable/babel"]
                }
            },
        ],
    },
    externals: nodeExternals(),
};