morteza mortezaie
morteza mortezaie

Reputation: 1564

what is the typescript type of axios in vue 3

I am using Vue 3-typescript with vue-auth package .

for installing vue-auth I need to a file like this

http/index.ts

import axios from 'axios';
import type { App } from 'vue';
axios.defaults.baseURL = process.env.VUE_APP_API_URL;

export default (app:App) => {
    app.axios = axios;
    app.$http = axios;

    app.config.globalProperties.axios = axios;
    app.config.globalProperties.$http = axios;
}

and I have type error here as you seen enter image description here what should I do ?

Upvotes: 0

Views: 1596

Answers (1)

Derek Pollard
Derek Pollard

Reputation: 7165

From the Vue 3 Documentation:

Some plugins install globally available properties to all component instances via app.config.globalProperties. For example, we may install this.$http for data-fetching or this.$translate for internationalization. To make this play well with TypeScript, Vue exposes a ComponentCustomProperties interface designed to be augmented via TypeScript module augmentation:

import axios from 'axios'

declare module 'vue' {
  interface ComponentCustomProperties {
    $http: typeof axios
  }
}

We can put this type augmentation in a .ts file, or in a project-wide *.d.ts file. Either way, make sure it is included in tsconfig.json. For library / plugin authors, this file should be specified in the types property in package.json.

Upvotes: 0

Related Questions