Import external javascript file and use functions globally in vue app
to add function(s) globally to vue
you need to extended vue
and write as plugin
it is pretty easy
do it as the fallow:
create file plugin.js
import webbshop from '@/assets/lib/js/webbshop.js';// MyPlugin its just a name change to whatever meet you needs.MyPlugin.install = function (Vue, options) { Vue.myGlobalMethod = function () { webshop.dothis(); }; Vue.mySecondGlobalMethod = function (a,b,c) { webshop.dothis(a,b,c); };...}
now import it to the main Vue file.
import Vue from 'vue'import App from './App.vue'import router from './router'import plugin from './plugin'Vue.config.productionTip = falseVue.use(plugin)new Vue({ router, render: h => h(App)}).$mount('#app')
after that vue attach your custom methods to all vue instances.
and you can access it anywhere by simply refer it to a vue inner function.
in markup:
<h1 v-text="mySecondGlobalMethod(1,2,3)"></h1>
in javascript:
const b = this.myGlobalMethod();