Typescript type error for Axios 1.2.22 & 1.3.4 · Issue #5578 · axios/axios

link管理

链接快照平台

输入网页链接，自动生成快照
标签化管理网页链接

Describe the bug

After upgrading from 1.2.0 to 1.2.2 or 1.3.4 (issue experienced with both versions), I'm experiencing two typing issues:

The typing is broken on


    response.headers

.
Error:

 TS2345: Argument of type 'AxiosResponseHeaders | Partial<RawAxiosHeaders & { Server: AxiosHeaderValue; "Content-Type": AxiosHeaderValue; "Content-Length": AxiosHeaderValue; "Cache-Control": AxiosHeaderValue; "Content-Encoding": AxiosHeaderValue; } & { ...; }>' is not assignable to parameter of type 'AxiosResponseHeaders | Partial<Record<string, string> & { 'set-cookie'?: string[] | undefined; }>'.
   Type 'Partial<RawAxiosHeaders & { Server: AxiosHeaderValue; "Content-Type": AxiosHeaderValue; "Content-Length": AxiosHeaderValue; "Cache-Control": AxiosHeaderValue; "Content-Encoding": AxiosHeaderValue; } & { ...; }>' is not assignable to type 'AxiosResponseHeaders | Partial<Record<string, string> & { 'set-cookie'?: string[] | undefined; }>'.
     Type 'Partial<RawAxiosHeaders & { Server: AxiosHeaderValue; "Content-Type": AxiosHeaderValue; "Content-Length": AxiosHeaderValue; "Cache-Control": AxiosHeaderValue; "Content-Encoding": AxiosHeaderValue; } & { ...; }>' is not assignable to type 'AxiosResponseHeaders'.
       Type 'Partial<RawAxiosHeaders & { Server: AxiosHeaderValue; "Content-Type": AxiosHeaderValue; "Content-Length": AxiosHeaderValue; "Cache-Control": AxiosHeaderValue; "Content-Encoding": AxiosHeaderValue; } & { ...; }>' is missing the following properties from type 'AxiosHeaders': set, get, has, delete, and 23 more.```
The typing is broken on
request => ({
    ...request,
    headers: {
      ...request.headers,
      'X-CSRF-Token': getCSRFToken(),
Error:
TS2345: Argument of type '(request: InternalAxiosRequestConfig<any>) => { headers: { 'X-CSRF-Token': string | undefined; "Content-Length"?: AxiosHeaderValue | undefined; ... 4 more ...; 'Content-Type'?: ContentType | undefined; }; ... 35 more ...; formSerializer?: FormSerializerOptions | undefined; }' is not assignable to parameter of type '(value: InternalAxiosRequestConfig<any>) => InternalAxiosRequestConfig<any> | Promise<InternalAxiosRequestConfig<any>>'.
  Type '{ headers: { 'X-CSRF-Token': string | undefined; "Content-Length"?: AxiosHeaderValue | undefined; "Content-Encoding"?: AxiosHeaderValue | undefined; Accept?: AxiosHeaderValue | undefined; "User-Agent"?: AxiosHeaderValue | undefined; Authorization?: AxiosHeaderValue | undefined; 'Content-Type'?: ContentType | undefin...' is not assignable to type 'InternalAxiosRequestConfig<any> | Promise<InternalAxiosRequestConfig<any>>'.
    Type '{ headers: { 'X-CSRF-Token': string | undefined; "Content-Length"?: AxiosHeaderValue | undefined; "Content-Encoding"?: AxiosHeaderValue | undefined; Accept?: AxiosHeaderValue | undefined; "User-Agent"?: AxiosHeaderValue | undefined; Authorization?: AxiosHeaderValue | undefined; 'Content-Type'?: ContentType | undefin...' is not assignable to type 'InternalAxiosRequestConfig<any>'.
      Types of property 'headers' are incompatible.
        Type '{ 'X-CSRF-Token': string | undefined; "Content-Length"?: AxiosHeaderValue | undefined; "Content-Encoding"?: AxiosHeaderValue | undefined; Accept?: AxiosHeaderValue | undefined; "User-Agent"?: AxiosHeaderValue | undefined; Authorization?: AxiosHeaderValue | undefined; 'Content-Type'?: ContentType | undefined; }' is not assignable to type 'AxiosRequestHeaders'.
          Type '{ 'X-CSRF-Token': string | undefined; "Content-Length"?: AxiosHeaderValue | undefined; "Content-Encoding"?: AxiosHeaderValue | undefined; Accept?: AxiosHeaderValue | undefined; "User-Agent"?: AxiosHeaderValue | undefined; Authorization?: AxiosHeaderValue | undefined; 'Content-Type'?: ContentType | undefined; }' is missing the following properties from type 'AxiosHeaders': set, get, has, delete, and 23 more.
To Reproduce
No response
Code snippet
import axios, { AxiosResponseHeaders } from 'axios';
import LinkHeader from 'http-link-header';
import reduce from 'lodash/reduce';
const apiClient = axios.create({
  baseURL: '/',
});
const formatPagination = (
  headers:
    | AxiosResponseHeaders
    | Partial<Record<string, string> & { 'set-cookie'?: string[] | undefined }>,
) => {
  if (headers?.link) {
    const parsedLink = LinkHeader.parse(headers.link);
    return {
      pagination: reduce(
        parsedLink.refs,
        (acc, link) => ({ ...acc, [link.rel]: link.uri ? parseInt(link.uri, 10) : null }),
        {},
      total: parseInt(headers['x-total-count'] || '0', 10),
  return undefined;
const getCSRFToken = () => {
  const element = document.querySelector('meta[name=csrf-token]') as HTMLMetaElement;
  if (element) {
    return element.content;
  return undefined;
apiClient.interceptors.response.use(
  response =>
      data: response.data,
      ...formatPagination(response.headers),
    } as any),
  Promise.reject,
apiClient.interceptors.request.use(
  request => ({
    ...request,
    headers: {
      ...request.headers,
      'X-CSRF-Token': getCSRFToken(),
  }),
  Promise.reject,
export default apiClient;
Expected behavior
No response
Axios Version
Tried with both 1.2.22 and 1.3.4
Adapter Version
No response
Browser
Chrome
Browser Version
No response
Node.js Version
16.13
macOS 13.2.1
Additional Library Versions
No response
Additional context/Screenshots
No response
Typescript type error on for Axios 1.2.22 & 1.3.4 
Typescript type error for Axios 1.2.22 & 1.3.4 
    Mar 3, 2023
          Hi, I got the exact same error in my project...
For now the only 'fix' I find is to set the var to any, which s*cks btw.
Any other trick to REALLY fix this issue ?