title: webpack2: configuring module rules
body: <p>I'm using webpack@2.6.1</p>
  
  <p>My config is pretty simple:</p>
  
  <pre><code>{
    resolve: {
      modules: [
        SRC_ROOT,
        "node_modules",
      ],
    },
  
    entry: "index.js",
  
    output: {
      path: sysPath.join(APP_ROOT, "dist"),
      filename: "index.js",
    },
  
    module: {
      rules: [
        {
          test: /\.js$/i,
          include: SRC_ROOT,
          use: [
            {
              loader: "eslint-loader",
              enforce: "pre",
              options: {
                failOnError: true,
                failOnWarning: true,
              },
            },
  
            {
              loader: "babel-loader",
            }
          ],
        }
      ]
    },
  }
  </code></pre>
  
  <p>And when I run it, I got following:</p>
  
  <pre><code>Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema.
   - configuration.module.rules[0].use should be one of these:
     non-empty string | function | object { loader?, options?, query? } | function | [non-empty string | function | object { loader?, options?, query? }]
     Details:
      * configuration.module.rules[0].use should be a string.
      * configuration.module.rules[0].use should be an instance of function.
      * configuration.module.rules[0].use should be an object.
      * configuration.module.rules[0].use should be one of these:
        non-empty string | function | object { loader?, options?, query? }
      * configuration.module.rules[0].use should be an instance of function.
      * configuration.module.rules[0].use[0] should be a string.
      * configuration.module.rules[0].use[0] should be an instance of function.
      * configuration.module.rules[0].use[0] has an unknown property 'enforce'. These properties are valid:
        object { loader?, options?, query? }
      * configuration.module.rules[0].use[0] should be one of these:
        non-empty string | function | object { loader?, options?, query? }
  </code></pre>
  
  <p>I'm confused, because these errors are totally contradict to what I see in docs: <a href="https://webpack.js.org/configuration/#options" rel="nofollow noreferrer">https://webpack.js.org/configuration/#options</a>. </p>
  
  <p>Arrays in "use" are not supported? "unknown property 'enforce'"? How is it even possible, when doc shows exactly the same usage examples?</p>
  
  <p>Please explain what am I doing wrong here.</p>