title: Vue/Webpack/Typescript - How to use jQuery Plugin
body: <p>I want to use the jQuery Plugin chosen in my vue.js/Webpack with TypeScript application.</p>
  
  <p>I read that it it's best to wrap the plugin in a custom Vue component.</p>
  
  <p>I installed the NPM packages:</p>
  
  <pre><code>npm install jquery --save
  npm install @types/jquery --save
  npm install chosen-js --save
  npm install @types/chosen-js --save
  </code></pre>
  
  <p>My component:</p>
  
  <pre><code>&lt;template&gt;
      &lt;select&gt;
          &lt;option value="1"&gt;Test1&lt;/option&gt;
          &lt;option value="2"&gt;Test2&lt;/option&gt;
      &lt;/select&gt;
  &lt;/template&gt;
  
  &lt;script lang="ts"&gt;
      import { Component, Prop, Vue } from "vue-property-decorator";
      import $ from 'jquery';    
      import 'chosen-js';
  
      @Component
      export default class ChosenSelect extends Vue{
          @Prop()options!:string;
          @Prop()value!:string;
  
          mounted() {
              let vm = this;
              let el = $(vm.$el);
              console.log(el);
          }
      }
  &lt;/script&gt;
  </code></pre>
  
  <p>Without <strong>import 'chosen-js'</strong> jQuery is working - when I'm using the component in another component I get a console output.</p>
  
  <p>With <strong>import 'chosen-js'</strong> I only get <code>Uncaught ReferenceError: jQuery is not defined</code> from the chosen library.</p>
  
  <p>What is the right way to import both - jQuery and chosen-js and use it in a vue Typescript component.</p>