vuejs3 : can't import axios globally

Question

I can import and use axios in a component:

import axios from 'axios'
export default function usePostLogin() {
 const login = async (url , data , callback) => {
    axios.post(url, data)
// etc

I want to import axios globally.

In main.js :

import axios from 'axios'

const app = createApp(App)
app.component('FontAwesome', FontAwesomeIcon)
app.use(createPinia()).use(router).use(axios)
app.mount('#app')

But then I get an error : error 'axios' is not defined no-undef

Answer 1

You can not add axios with use in Vue3, in main.js add it to the global property:

app.config.globalProperties.axios = axios

and in component use it like:

this.axios