Axios中AxiosRequestConfig导入报错，配置tsconfig.json无效求助

问题分析 #

报错Module 'axios' has no exported member 'AxiosRequestConfig'源于Axios版本更新后类型导出方式的变化，或是导入语法不符合当前版本的规范。

有效解决方法 #

方法1：使用TypeScript类型导入语法 #

明确用import type导入类型，避免与值导入产生混淆：

import axios from "axios";
import type { AxiosRequestConfig } from "axios";

const axiosInstance = axios.create({
  baseURL: "https://api.example.com",
});

axiosInstance.interceptors.request.use(
  (config: AxiosRequestConfig) => {
    return config;
  },
  (error) => {
    return Promise.reject(error);
  }
);

axiosInstance.interceptors.response.use(
  (response) => {
    return response;
  },
  (error) => {
    return Promise.reject(error);
  }
);

export default axiosInstance;

方法2：直接从axios默认导出的命名空间引用类型 #

无需单独导入类型，直接用axios.AxiosRequestConfig作为注解：

import axios from "axios";

const axiosInstance = axios.create({
  baseURL: "https://api.example.com",
});

axiosInstance.interceptors.request.use(
  (config: axios.AxiosRequestConfig) => {
    return config;
  },
  (error) => {
    return Promise.reject(error);
  }
);

axiosInstance.interceptors.response.use(
  (response) => {
    return response;
  },
  (error) => {
    return Promise.reject(error);
  }
);

export default axiosInstance;

方法3：适配Axios版本 #

• 若使用Axios v1.x及以上：包内已自带类型定义，使用上述两种方法即可解决。
• 若使用Axios v0.26及以下：需单独安装类型依赖：

  npm install @types/axios --save-dev
  

内容的提问来源于stack exchange，提问作者Adinai Zhamangulova