RTK Query - 'useQuery' does not exist

[ideco]

Hi,

I'm trying to make this example work (following the guides).

export const api = createApi({
    baseQuery: fetchBaseQuery({ baseUrl: 'http://example.com/' }),
    reducerPath: 'bills',
    endpoints: (builder) => ({
        getBills: builder.query<string, string>({
            query: (value) => `foo/${value}`
        }),
        getBills2: builder.query<string, string>({
            async queryFn(value : string) {
                return { data: value }
            }
        })
    })
})

api.endpoints.getBills.useQuery("foo");
api.endpoints.getBills2.useQuery("foo");

But somehow useQuery does not seem to exist on the endpoint.

ERROR in src/features/bills/billsSlice.ts:68:25
TS2339: Property 'useQuery' does not exist on type 'ApiEndpointQuery<QueryDefinition<string, BaseQueryFn<string | FetchArgs, unknown, FetchBaseQueryError, {}, FetchBaseQueryMeta>, never, string, "bills2">, { ...; }>'.
    66 | })
    67 |
  > 68 | api.endpoints.getBills2.useQuery("foo");

initiate and select are there though. Am I doing something wrong or did the api change?

Thanks for the great work and the help!

[phryneas]

Did you import from @reduxjs/toolkit/query or @reduxjs/toolkit/query/react? The hooks only exist on the latter.

[ideco]

From @reduxjs/toolkit/query of course! Thank you very much, I was stuck in a loop!