vuejs 3 multiple plugins

Question

How can I use multiple plugins within vuejs 3?

import { createApp } from 'vue'
import App from './App.vue'
import router from './router'
import axios from 'axios'
import Antd from 'ant-design-vue';
import 'ant-design-vue/dist/antd.css';

createApp(App).use(router, axios, Antd).mount('#app')

Within Main.js, this seems to import router and axios, but not Antd. If I take off router, and axios then I can see antd components. How do I bring in everything?

Answer 1

Each plugin must be in its own app.use() call:

createApp(App).use(pluginA).use(pluginB).use(pluginC).mount('#app')

However, axios is not a Vue plugin, so don't install that with app.use().

Your code should look similar to this:

createApp(App).use(router).use(Antd).mount('#app')