ERROR: configuration.module has an unknown property 'loaders'. These properties are valid, 2022-08-29

npm run dev-server 시 발생

module.exports = {
    entry: './src/index.js',

    output: {
        path: __dirname + '/public/',
        filename: 'bundle.js'
    },

    devServer: {
        inline: true,
        port: 7777,
        contentBase: __dirname + '/public/'
    },

    module: {
            loaders: [
                {
                    test: /\.js$/,
                    loader: 'babel-loader',
                    exclude: /node_modules/,
                    query: {
                        cacheDirectory: true,
                        presets: ['es2015', 'react']
                    }
                }
            ]
        }
};


var webpack = require('webpack');

module.exports = {
    entry: './src/index.js',

    output: {
        path: __dirname + '/public/',
        filename: 'bundle.js'
    },

    devServer: {
        hot: true,
        host: '0.0.0.0',
        port: 4000,
        static: __dirname + '/public/'
    },

    module: {
        rules: [
                {
                    test: /\.js$/,
                    loader: 'babel-loader',
                    exclude: /node_modules/,
                    options: {
                        cacheDirectory: true,
                        presets: ['es2015', 'react']
                    }
                }
            ]
        },

        plugins:[
            new webpack.HotModuleReplacementPlugin()
        ]
};

error : configuration.module has an unknown property 'loaders'. These properties are valid

loader 대신에 rules

error : configuration.module.rules[0] has an unknown property 'query'. These properties are valid

query 대신에 options

error : options has an unknown property 'contentBase'. These properties are valid

contentBase 대신에 static

error : options has an unknown property 'inline'. These properties are valid

inline 삭제