Using external Vue component after build

Question

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'},
    }),
});

This should be the basic template for every plugin.

Franck Freiburger · Accepted Answer · 2020-12-08 07:56:17Z

2

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

edited Dec 8, 2020 at 7:56

Franck Freiburger

28.8k21 gold badges75 silver badges97 bronze badges

answered Oct 9, 2020 at 12:45

Cosimo Chellini

1,7201 gold badge16 silver badges21 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Mohammed Malhas Over a year ago

exactly what i want, Thank you❤.

den0 Over a year ago

This works but for some reason vuetify components are not registered in http-vue-loader SFC. I am using webpack.

Collectives™ on Stack Overflow

Using external Vue component after build

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related