"The inferred type... cannot be named without a reference to {npm package}. This is likely not portable. A type annotation is necessary."

[komali2]

What version of kubb is running?

3.05

What platform is your computer?

linux

What version of external packages are you using(@tanstack-query, MSW, React, Vue, ...)

tanstack query: 5.51.23, react: 18,

What steps can reproduce the bug?

Integrate this into an openapi.json file:

    "/steps/{step_id}": {
      "delete": {
        "tags": [
          "Steps"
        ],
        "summary": "Flag a step as deleted",
        "operationId": "delete_step",
        "security": [
          {
            "OAuth2PasswordBearer": []
          }
        ],
        "parameters": [
          {
            "name": "step_id",
            "in": "path",
            "required": true,
            "schema": {
              "type": "integer",
              "exclusiveMinimum": 0,
              "title": "Step Id"
            }
          }
        ],
        "responses": {
          "200": {
            "description": "Successful Response",
            "content": {
              "application/json": {
                "schema": {
                  "$ref": "#/components/schemas/Step"
                }
              }
            }
          },
          "400": {
            "description": "Bad Request",
            "content": {
              "application/json": {
                "schema": {
                  "type": "object",
                  "properties": {
                    "errors": {
                      "type": "array",
                      "items": {
                        "type": "object",
                        "properties": {
                          "code": {
                            "type": "string"
                          },
                          "field": {
                            "type": "array",
                            "items": {
                              "type": "string"
                            }
                          },
                          "message": {
                            "type": "string"
                          }
                        }
                      }
                    }
                  }
                }
              }
            }
          },
          "401": {
            "description": "Unauthorized",
            "content": {
              "application/json": {
                "schema": {
                  "type": "object",
                  "properties": {
                    "message": {
                      "type": "string"
                    }
                  }
                }
              }
            }
          },
          "403": {
            "description": "Forbidden",
            "content": {
              "application/json": {
                "schema": {
                  "type": "object",
                  "properties": {
                    "message": {
                      "type": "string"
                    }
                  }
                }
              }
            }
          },
          "404": {
            "description": "Not Found",
            "content": {
              "application/json": {
                "schema": {
                  "type": "object",
                  "properties": {
                    "message": {
                      "type": "string"
                    }
                  }
                }
              }
            }
          }
        }
      },
      "get": {
        "tags": [
          "Steps"
        ],
        "summary": "Get a step",
        "operationId": "get_step",
        "security": [
          {
            "OAuth2PasswordBearer": []
          }
        ],
        "parameters": [
          {
            "name": "step_id",
            "in": "path",
            "required": true,
            "schema": {
              "type": "integer",
              "exclusiveMinimum": 0,
              "title": "Step Id"
            }
          }
        ],
        "responses": {
          "200": {
            "description": "Successful Response",
            "content": {
              "application/json": {
                "schema": {
                  "$ref": "#/components/schemas/Step"
                }
              }
            }
          },
          "400": {
            "description": "Bad Request",
            "content": {
              "application/json": {
                "schema": {
                  "type": "object",
                  "properties": {
                    "errors": {
                      "type": "array",
                      "items": {
                        "type": "object",
                        "properties": {
                          "code": {
                            "type": "string"
                          },
                          "field": {
                            "type": "array",
                            "items": {
                              "type": "string"
                            }
                          },
                          "message": {
                            "type": "string"
                          }
                        }
                      }
                    }
                  }
                }
              }
            }
          },
          "401": {
            "description": "Unauthorized",
            "content": {
              "application/json": {
                "schema": {
                  "type": "object",
                  "properties": {
                    "message": {
                      "type": "string"
                    }
                  }
                }
              }
            }
          },
          "403": {
            "description": "Forbidden",
            "content": {
              "application/json": {
                "schema": {
                  "type": "object",
                  "properties": {
                    "message": {
                      "type": "string"
                    }
                  }
                }
              }
            }
          },
          "404": {
            "description": "Not Found",
            "content": {
              "application/json": {
                "schema": {
                  "type": "object",
                  "properties": {
                    "message": {
                      "type": "string"
                    }
                  }
                }
              }
            }
          }
        }
      },
      "patch": {
        "tags": [
          "Steps"
        ],
        "summary": "Update a step",
        "operationId": "update_step",
        "security": [
          {
            "OAuth2PasswordBearer": []
          }
        ],
        "parameters": [
          {
            "name": "step_id",
            "in": "path",
            "required": true,
            "schema": {
              "type": "integer",
              "exclusiveMinimum": 0,
              "title": "Step Id"
            }
          }
        ],
        "requestBody": {
          "required": true,
          "content": {
            "application/json": {
              "schema": {
                "$ref": "#/components/schemas/UpdateStep"
              }
            }
          }
        },
        "responses": {
          "200": {
            "description": "Successful Response",
            "content": {
              "application/json": {
                "schema": {
                  "$ref": "#/components/schemas/Step"
                }
              }
            }
          },
          "422": {
            "description": "Unprocessable Entity",
            "content": {
              "application/json": {
                "schema": {
                  "type": "object",
                  "properties": {
                    "code": {
                      "type": "string"
                    },
                    "message": {
                      "type": "string"
                    }
                  }
                }
              }
            }
          },
          "400": {
            "description": "Bad Request",
            "content": {
              "application/json": {
                "schema": {
                  "type": "object",
                  "properties": {
                    "errors": {
                      "type": "array",
                      "items": {
                        "type": "object",
                        "properties": {
                          "code": {
                            "type": "string"
                          },
                          "field": {
                            "type": "array",
                            "items": {
                              "type": "string"
                            }
                          },
                          "message": {
                            "type": "string"
                          }
                        }
                      }
                    }
                  }
                }
              }
            }
          },
          "401": {
            "description": "Unauthorized",
            "content": {
              "application/json": {
                "schema": {
                  "type": "object",
                  "properties": {
                    "message": {
                      "type": "string"
                    }
                  }
                }
              }
            }
          },
          "403": {
            "description": "Forbidden",
            "content": {
              "application/json": {
                "schema": {
                  "type": "object",
                  "properties": {
                    "message": {
                      "type": "string"
                    }
                  }
                }
              }
            }
          },
          "404": {
            "description": "Not Found",
            "content": {
              "application/json": {
                "schema": {
                  "type": "object",
                  "properties": {
                    "message": {
                      "type": "string"
                    }
                  }
                }
              }
            }
          },
          "409": {
            "description": "Conflict",
            "content": {
              "application/json": {
                "schema": {
                  "type": "object",
                  "properties": {
                    "code": {
                      "type": "string"
                    },
                    "field": {
                      "type": "string"
                    },
                    "message": {
                      "type": "string"
                    }
                  }
                }
              }
            }
          }
        }
      }
    }

Follow a config similar to this:

import { defineConfig } from "@kubb/core";
import { pluginTs } from "@kubb/plugin-ts";
import { pluginZod } from "@kubb/plugin-zod";
import { pluginReactQuery } from "@kubb/plugin-react-query";
import { pluginOas } from "@kubb/plugin-oas";

export default defineConfig({
  root: ".",
  input: {
    path: "./apps/backend/openapi.json",
  },
  output: {
    path: "./apps/webapp/src/gen",
    clean: true,
  },
  hooks: {
    done: ["npm run lintfix", "npm run format"],
  },
  plugins: [
    pluginOas(),
    pluginTs({
      output: {
        path: "models",
      },
      group: {
        type: "tag",
        name: ({ group }) => `${group}Controller`,
      },
      enumType: "literal",
    }),
    pluginZod({
      output: {
        path: "./zod",
      },
      group: {
        type: "tag",
        name: ({ group }) => `${group}Schemas`,
      },
      typed: true,
      dateType: "stringOffset",
      unknownType: "unknown",
      importPath: "zod",
    }),
    pluginReactQuery({
      output: {
        path: "./hooks",
      },
      group: {
        type: "tag",
        name: ({ group }) => `${group}Hooks`,
      },
      client: {
        dataReturnType: "full",
      },
      mutation: {
        methods: ["post", "put", "delete"],
      },
      infinite: {
        queryParam: "page",
        initialPageParam: 0,
        cursorParam: undefined,
      },
      query: {
        methods: ["get"],
        importPath: "@tanstack/react-query",
      },
      parser: "zod",
      pathParamsType: "object",
    }),
  ],
});

Generate.

Open /src/gen/hooks/stepsHooks/useGetStep.ts.

Observe the following typescript errors:

 useGetStep.ts    42  17 error    2742   The inferred type of 'getStepQueryOptions' cannot be named without a reference to '../../../../../../node_modules/@tanstack/query-core/build/modern/hydration-zFr_7WN8.js'. This is likely not portable. A type annotation is necessary. (lsp)
 useGetStep.ts    42  17 error    2742   The inferred type of 'getStepQueryOptions' cannot be named without a reference to '../../../../../../node_modules/@tanstack/react-query/build/modern/types.js'. This is likely not portable. A type annotation is necessary. (lsp)

on this function:

export function getStepQueryOptions(
  { step_id }: GetStepPathParams,
  config: Partial<RequestConfig> = {}
) {
  const queryKey = getStepQueryKey({ step_id });
  return queryOptions({
    enabled: !!step_id,
    queryKey,
    queryFn: async ({ signal }) => {
      config.signal = signal;
      return getStep({ step_id }, config);
    },
  });
}

Can be temporarily resolved by adding:

import type _1 from "@tanstack/query-core";
import type _2 from "@tanstack/react-query";

How often does this bug happen?

Every time

What is the expected behavior?

No typescript errors :P

Swagger/OpenAPI file?

linked above

Additional information

No response

[linear[bot]]

KUBB-67 "The inferred type... cannot be named without a reference to {npm package}. This is likely not portable. A type annotation is necessary."