title: Webpack: how to use the library depends on another library as module?
body: <p>To make <code>jquery.selection</code> library work, <code>jquery</code> library must be loaded, because <code>jquery.selection</code> has the <a href="http://benalman.com/news/2010/11/immediately-invoked-function-expression/" rel="nofollow noreferrer">IIFE</a> (Immediately-Invoked Function Expression) which depends on <code>jquery</code>.  Normally, we need to do it like</p>
  
  <pre><code>&lt;script type="text/javascript" src="jquery.min.js"&gt;
  &lt;script type="text/javascript" src="jquery.selection.min.js"&gt;
  </code></pre>
  
  <p>However, what if we use <code>webpack</code> and want to add <code>jquery.selection</code> as module?</p>
  
  <pre><code>import $ from 'jquery';
  import 'jquery.selection';
  </code></pre>
  
  <p>Although <code>Webpack</code> will be executed without errors, in Chrome console the following error message will appear:</p>
  
  <pre><code>Uncaught TypeError: Cannot read property 'fn' of undefined
  </code></pre>
  
  <p>Because we should not to tamper in the library, <a href="https://stackoverflow.com/questions/10807430/jquery-uncaught-typeerror-cannot-read-property-fn-of-undefined-anonymous-fun">this</a> solution may not be used.</p>