Using external Vue component after build

I’m trying to make a website with plugins, the admin panel is all Vue.js, and I want the plugin to be an external component (Rating.vue, AdsConnect.vue), how I can do that, and is that possible?

I think that the Eval function can help me, but I really don’t know; and, in case I can’t use external components, can I use the component after building the component itself?

try {
    window.axios = require('axios');
    window.axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';
    window.Vue = require('vue');
} catch (e) {
}

import Vuetify from 'vuetify'
Vue.use(Vuetify);

import App from './App.vue'
const app = new Vue({
    el: '#app',
    render: h => h(App),
    vuetify: new Vuetify({
        icons: {iconfont: 'mdi'},
    }),
});

JavaScript
​x
 
try {
    window.axios = require('axios');
    window.axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';
    window.Vue = require('vue');
} catch (e) {
}
​
import Vuetify from 'vuetify'
Vue.use(Vuetify);
​
import App from './App.vue'
const app = new Vue({
    el: '#app',
    render: h => h(App),
    vuetify: new Vuetify({
        icons: {iconfont: 'mdi'},
    }),
});
​

This should be the basic template for every plugin.

Answer

If you’re hosting the .vue file on your serve you can use this library https://github.com/FranckFreiburger/http-vue-loader for Vue2, and https://github.com/FranckFreiburger/vue3-sfc-loader for Vue3

This library load via http your components

Advertisement

Answer