title: Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema
body: <p>i am new to reactjs and i am trying to configure my first project with webpack. </p>
  
  <p>webpack.config.js</p>
  
  <pre><code>    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()
      ]
  };
  </code></pre>
  
  <p>after creating a react project i am trying to run it using <code>webpack-dev-server</code> command. but i get a long list of error as shown below. </p>
  
  <pre><code>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.
  </code></pre>
  
  <p>my webpack version </p>
  
  <pre><code>webpack -version 
  3.0.0
  </code></pre>