使用 tanstack-query v5 在 kubb 中配置基本 URL

Question

我将

kubb

与

tanstack-query

v5一起使用，遗憾的是示例https://www.kubb.dev/examples/tanstack-query/react-query-v5不起作用，所以我没有机会找到我遇到的问题，特别是因为这篇文章最近似乎已更改。

始终使用正确的相对路径集向

localhost

发出请求。

http://localhost:8081/correct/path/to/api/resource
// Failed to load resource: the server responded with a status of 404 (Not Found)

在

localhost:8081

，我的开发服务器正在运行。

所以我尝试配置

queryClient

来设置基本 URL。

import axios from "axios";
import { QueryClient } from "@tanstack/react-query";

const axiosInstance = axios.create({
    baseURL: "https://base.url.com",
    timeout: 15000
});

const client = new QueryClient({
    defaultOptions: {
        queries: {
            queryFn: async ({ queryKey }) => {
                console.log("Query Key:", queryKey); // NEVER LOGGED

                const { data } = await axiosInstance.get(queryKey[0] as string);
                return data;
            },
            staleTime: 0
        }
    }
});

export default client;

然后将

client

包裹在

App

中（但这有效，因为已发出请求）。

import { QueryClientProvider } from "@tanstack/react-query";
import client from "../api/client";

<QueryClientProvider client={client}>
    <ThemeProvider theme={theme.customTheme}>
        <SafeAreaProvider>
            <Stack>
                ...
            </Stack>
        </SafeAreaProvider>
    </ThemeProvider>
</QueryClientProvider>

这是使用 kubb 执行此操作的正确方法吗？ 网络是这么说的，但由于“查询密钥”从未被记录，因此似乎此代码从未运行。

旧版本的 kubb 显然在其配置中具有基本 URL，但情况似乎不再如此。

Answer 1

在最新版本的 Kubb 中，您可以使用

baseURL

来覆盖默认基础。请参阅https://www.kubb.dev/knowledge-base/base-url