How to use bootstrap select plugin with vuejs directive and browserify
<p>I want to use bootstrap select plugin on a vuejs project and I am confused on how to incorporate it into my project as a directive. I came up with the following after looking at the select2 example in the vuejs website.</p>

<pre><code>&lt;span id="el"&gt;
  &lt;select class="selectpicker" data-style="btn-primary" v-selectpicker="selected" :options="workflow"&gt;
    &lt;option value="0"&gt;default&lt;/option&gt;
  &lt;/select&gt;                                                    
&lt;/span&gt;
</code></pre>

<p>Here is my directive and view </p>

<pre><code>require("bootstrap-select");

Vue.directive('selectpicker',{  

    twoWay: true,

    deep: true,

    bind: function() {          
        $(this.el).selectpicker().on("change", function(e) {
            this.set($(this.el).val());
        }.bind(this));
    },
    update: function (value) {
        $(this.el).selectpicker('refresh').trigger("change");
    },
    unbind: function () {
        $(this.el).off().selectpicker('destroy');
    }
});


new Vue({

    el: '#el',

    data: {

        tasksLoaded: false,
        tasks: [],
        workflow: [
            {
                id:'todo',
                value: 'To Do'
            }, 
            {
                id: 'backlog', 
                value: 'Backlog'
            },
            {
                id: 'doing', 
                value: 'Doing'
            },
            {
                id: 'restest', 
                value:'Retest'
            },
            {
                id: 'completed', 
                value: 'Completed'
            },
            {
                id: 'deployed',
                value: 'Deployed'
            }
        ],
        sections:[],
        tests:[],
        sectionId: '',
        testId: ''
    },

    watch: {            
        // watch these particular models for changes and then fire on trigger       
        sectionId: function(value) {                        
            this.getTests(value);                   
        },
        testId: function(value) {
            this.getResults(value);
        }
    }
});
</code></pre>

<p>I end up getting the error </p>

<pre><code>Uncaught TypeError: $(...).selectpicker is not a function
</code></pre>

<p>and I have already checked if is already called or not and it is already present. </p>

<p>Also, I am using laravel spark so it already has jQuery defined inside the app.js file through </p>

<pre><code>require('laravel-spark/core/bootstrap');
</code></pre>