title: Importing jQuery plugins in webpack
body: <p>I have searched and found many articles most talking about angular or react. My project includes neither of these.</p>
  
  <p>I am simply trying to import an old jquery module into a js file using webpack.</p>
  
  <p>I have jquery included using this method:</p>
  
  <pre><code>plugins: [
      new webpack.ProvidePlugin({
          $: "jquery",
          jQuery: "jquery"
      })
  ]
  </code></pre>
  
  <p>This works. I can access jquery in the files I need to.</p>
  
  <p>However when I try and import a script for example:</p>
  
  <pre><code>import coverflow from '../vendor/coverflow/dist/coverflow';
  </code></pre>
  
  <p>source:
  <a href="https://github.com/coverflowjs/coverflow" rel="nofollow noreferrer">https://github.com/coverflowjs/coverflow</a></p>
  
  <p>I get a browser error </p>
  
  <pre><code>Cannot read property 'createElement' of undefined
  </code></pre>
  
  <p>When I look this up I see that 'undefined' is referring to document. How is document not defined? Why does this import not work.</p>
  
  <p>using the method:</p>
  
  <pre><code>rules: [
      {
          test: require.resolve('./js/vendor/coverflow/dist/coverflow.js'),
          use: "imports-loader?this=&gt;window"
      }
  ],
  </code></pre>
  
  <p>I get this error:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>[0] Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema.
  [0]  - configuration has an unknown property 'rules'. These properties are valid:
  [0]    object { amd?, bail?, cache?, context?, dependencies?, devServer?, devtool?, entry, externals?, loader?, module?, name?, node
  ?, output?, performance?, plugins?, profile?, recordsInputPath?, recordsOutputPath?, recordsPath?, resolve?, resolveLoader?, stats?,
   target?, watch?, watchOptions? }
  [0]    For typos: please correct them.
  [0]    For loader options: webpack 2 no longer allows custom properties in configuration.
  [0]      Loaders should be updated to allow passing options via loader options in module.rules.
  [0]      Until loaders are updated one can use the LoaderOptionsPlugin to pass these options to the loader:
  [0]      plugins: [
  [0]        new webpack.LoaderOptionsPlugin({
  [0]          // test: /\.xxx$/, // may apply this only for some modules
  [0]          options: {
  [0]            rules: ...
  [0]          }
  [0]        })
  [0]      ]</code></pre>
  </div>
  </div>
  </p>