TypeScript中axios.get传入自定义header函数返回值报类型不匹配错误

这个报错是TypeScript类型校验触发的，你的authHeader函数没有显式声明返回类型，TypeScript自动推断它的返回值是{ 'x-access-token': any; } | {}联合类型，该类型无法和axios要求的AxiosRequestHeaders类型匹配。你直接写死header对象时，TypeScript可以自动推断出该对象的键值结构符合AxiosRequestHeaders要求，因此不会触发报错。

• 方案1：给authHeader函数显式声明返回类型（最优解）
  从函数定义层面规范返回值类型，后续所有调用该函数的场景都不会触发同类报错，修改后的代码如下：

import type { AxiosRequestHeaders } from 'axios';

export default function authHeader(): AxiosRequestHeaders {
    const userStr = localStorage.getItem("user");
    let user = null;
    if (userStr)
      user = JSON.parse(userStr);
  
    if (user && user.accessToken) {      
      return { 'x-access-token': user.accessToken };
    } else {
      return {};
    }
}

• 方案2：调用时做临时类型断言
  如果不想修改authHeader的原有定义，可以在调用axios的位置做单次类型断言，改动量最小：

import authHeader from './auth-header';
import type { AxiosRequestHeaders } from 'axios';

return axios.get(API_URL + 'user', { headers: authHeader() as AxiosRequestHeaders });

• 方案3：放宽TypeScript校验规则（不推荐）
  你也可以在tsconfig.json中添加"skipLibCheck": true配置，跳过第三方库的类型校验，但该方案会关闭所有库文件的类型检查，可能隐藏其他合法的类型错误，非特殊情况不建议使用。

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