Как для одного use задать несколько loader'ов в Webpack4 конфигурации?

Question

[Maverick17user]

Впервые пробую Webpack(4.28.1).
Есть такой код webpack.config.js:

const path = require('path');

module.exports = {
    entry: __dirname + '/src/components/App.jsx',
    output: {
        publicPath: 'dest/js',
        path: path.resolve(__dirname, '/dest/js'),
        filename: 'bundle.js'
    },
    devtool: '#sourcemap',
    module: {
        rules: [
            {
                test: /\.jsx?$/,
                exclude: /node_modules/,
                use: [
                    {
                        loader: 'react-hot-loader'
                    },
                    {
                        loader: 'babel-loader',
                        options: {
                            presets: ['@babel/env', '@babel/react']
                        }
                    }
                ]
            }
        ]
    }
}

Мне нужен функционал react-hot-loader и babel-loader, но не понятно, как правильно объявить два loader'а в одном use.
При старте web-dev-server'a выдаёт ошибку:

Как решить эту проблему?

Answer 1

[Евгений Тройнов]

В ошибке говорится что используется невалидный loader попробуйте снести node_modules и поставить заново или поставить react-hot-loader версией ниже.

Вот так это сделано у create-react-app:
https://github.com/facebook/create-react-app/blob/...