portal/resources/assets/vue/app.js

/** Dependencies */
import Vue from 'vue'
import store from './vuex/store';

window.route = require('./general/functions/router');

/** Guards */
import guards from './general/mixins/guards';

/** Validation **/
import vuelidate from 'vuelidate';

/** Input Mask **/
import VueTheMask from 'vue-the-mask';


/** Mixins */
import request from './general/mixins/request';
import crudHandler from './general/mixins/crudHandler';

/** Directives */
import closable from './general/directives/closable';

import Avatar from 'vue-avatar';

/** Application Injections */
Vue.use(vuelidate);
Vue.use(VueTheMask);
Vue.directive('closable', closable);
Vue.directive('tooltip', function(el, binding){
    $(el).tooltip({
        title: binding.value,
        placement: binding.arg,
        trigger: 'hover'
    })
})
Vue.mixin({
    methods: {
        route: route
    },
    mixins: [request, crudHandler]
    });

/** Components Registrations */
Vue.component(Avatar);

const files = require.context('./', true, /\.vue$/i);
files.keys().map(key => Vue.component(key.split('/').pop().split('.')[0], files(key).default));

const app = new Vue({
    el: '#app',
    store,
    created(){
        this.routesGuard();
    },
    methods: {
        route: route
    },
    mixins: [guards]
});