Issue with Next.js path
Using this guide https://docs.convex.dev/quickstart/nextjs (step 9)
I'm at a wall for awhile now, the module can't be found. I'm thinking it's because the lack of /_generated/api because that's not a folder that exists. But I'm curious is the issue simply that(no api folder)? "use client" isn't working, I'm assuming due to path issue.
Here's my code:
Next.js Quickstart | Convex Developer Hub
Add Convex to a Next.js project
6 Replies
Hey @salah7252, you need to run
npx convex dev successfully to get the _generated folder generated.
Then the import path is relative, note that the quickstart has two dots at the start:
import { api } from "../convex/_generated/api";
but your code only has a single dot:
import { api } from "./_generated/api.js";
In the standard setup the convex folder is a sibling to your Next.js app folder.Even with .. it's not taking. Oddly..my tasks.ts folder is also having issues with the import. I restarted the project in a desperate attempt lol.
also could the issue be related to the path being listed as "_generated/api" with no file/folder named "api"?
I have it as a sibling as well.
It looks like it should be
../../convex since it's in src/app/page.tsx. .. goes to src, ../../ goes to the project root, then ../../convex/ goes to the convex folder
inside of the convex folder you should have a _generated folder with api.js in there.Sorry to keep being a bother. I fixed my nesting issue but for a few days now I cannot get "const tasks = useQuery(api.tasks.get);" to work.
I keep getting this error: const tasks = useQuery(api.tasks.get);
Hey @salah7252 , looks like the error got cut off