配置对象无效。 Webpack已使用与API架构不匹配的配置对象进行初始化

Question

我是reactjs的新手，我正在尝试使用webpack配置我的第一个项目。

webpack.config.js

    var webpack = require('webpack');
var path = require('path');

module.exports = {
    devtool: 'inline-source-map',
    entry: [
        'webpack-dev-server/client?http://127.0.0.1:8080/',
        'webpack/hot/only-dev-server',
        './src'
    ],
    output: {
        path: path.join(__dirname, 'public'),
        filename: 'bundle.js'
    },
    resolve: {
        modulesDirectories: ['node_modules', 'src'],
        extensions: ['', '.js']
    },
    module: {
        loaders: [
        {
            test: /\.jsx?$/,
            exclude: /node_modules/,
            loaders: ['react-hot', 'babel?presets[]=react,presets[]=es2015']
        }
        ]
    },
    plugins: [
        new webpack.HotModuleReplacementPlugin(),
        new webpack.NoErrorsPlugin()
    ]
};

创建反应项目后，我尝试使用webpack-dev-server命令运行它。但我得到一长串错误，如下所示。

Invalid configuration object. Webpack has been initialised using a configuration 
object that does not match the API schema.
- configuration.resolve has an unknown property 'modulesDirectories'. 
These properties are valid: object { alias?, aliasFields?,cachePredicate?, 
descriptionFiles?,enforceExtension?, enforceModuleExtension?,extensions?,
fileSystem?, mainFields?, mainFiles?,moduleExtensions?, modules?, plugins?, 
resolver?, symlinks?, unsafeCache?, useSyncFileSystemCalls? }
- configuration.resolve.extensions[0] should not be empty.

我的网络包版

webpack -version 
3.0.0