Deepansh .i
Deepansh .i

Reputation: 9

⨯ TypeError: react__WEBPACK_IMPORTED_MODULE_2__.useContext is not a function

I am working on a Next.js project where I am using TRPC and React Query for data fetching. However, I am encountering a TypeError: useContext is not a function error. Here is my setup:

TRPC Client Setup src/utils/trpc.ts

1.

TRPC Router src/server/router.ts

2.

App Component src/pages/_app.tsx

3.

Home Component src/pages/index.tsx

4.

here i am getting error

error message : TypeError: react__WEBPACK_IMPORTED_MODULE_2__.useContext is not a function
    at Home (./src/pages/index.tsx:11:68)
    at stringify (<anonymous>)

What I Have Tried ->

Ensured that React Query is properly set up and wrapped in QueryClientProvider. Tried using TRPC without React Query, but encountered issues with createTRPCClient.

Question ->

How can I resolve the TypeError: useContext is not a function error when using TRPC with React Query in a Next.js project? Is there an alternative approach to achieve the same functionality without encountering this issue?

Upvotes: 0

Views: 297

Answers (1)

Szymon Dołhan
Szymon Dołhan

Reputation: 11

You forgot about "use client" in component.

Upvotes: 1

Related Questions