Webpack complains about loader:['react-hot-loader/webpack','babel-loader'],

[bemineni]

webpack doesn't seems to allow adding loader:['react-hot-loader/webpack','babel-loader'],
app:devServer Enabling webpack dev middleware. +0ms
/home/ekam/devel/payloadApp/node_modules/webpack/lib/RuleSet.js:174
throw new Error(RuleSet.buildErrorMessage(rule, new Error("options/query cannot be used with loaders (use options for each array item)")));
^

Error: options/query cannot be used with loaders (use options for each array item) in {
"test": {},
"exclude": {},
"loader": [
"react-hot-loader/webpack",
"babel-loader"
],
"query": {
"presets": [
"react",
"es2015",
"stage-2"
]
}
}

var webpack = require('webpack');
var HTMLWebpackPlugin = require('html-webpack-plugin')
var HTMLWebpackPluginConfig = new HTMLWebpackPlugin({
			template: __dirname + '/app/index.html',
			filename: 'index.html',
			inject: 'body'
		});
var CopyWebpackPlugin = require('copy-webpack-plugin')
var CopyWebpackPluginConfig = new CopyWebpackPlugin([{ from: 'static'}])

const path = require('path');

module.exports = {

	entry: ['react-hot-loader/patch',
			'webpack-dev-server/client?http://0.0.0.0:8080',
			'webpack/hot/only-dev-server', //<- doesn’t reload the browser upon syntax errors. This is recommended for React apps because it keeps the state
			//'webpack/hot/dev-server', //<- To perform HMR in the browser reloads if HMR update fails.
			__dirname + '/app/index.js'],

	context: __dirname,
	module:{
		loaders:[
			{
				test:/\.js$/,
				exclude: /node_modules/,
				loader:['react-hot-loader/webpack','babel-loader'],
				query:{
					presets:["react","es2015","stage-2",]
				}
				
			},
			{
				test: /\.css$/,
				exclude: /node_modules/,
				loader: 'style!css'
			}
		]
	},
	output:{
		filename:'payload-min.js',
		path: __dirname + '/build',
		publicPath: __dirname + '/build'
	},
	plugins:[CopyWebpackPluginConfig , 
			 HTMLWebpackPluginConfig ,
			 new webpack.HotModuleReplacementPlugin(),
    		 new webpack.NoEmitOnErrorsPlugin()]

};