I am using Next.js 14 app router on Vercel with Mantine for components. I'm using Next.js Links polymorphically with Mantine components as described here. This was working fine, but in recent deployments for changes that did not touch these Links or update any relevant packages, some of the Links began doing full-page reloads. This happens only in the deployed Vercel site, not using next dev or next build && next start locally.
You can see the behaviour on the button on the home page of my site: site / code.
However, the issue does not happen in other places. For example, the button on my not-found page: site / code. On the button there, it properly redirects to /organizers fully client-side.
Both the home page and the not-found page are statically exported, and these Links are going to the same place, so I don't understand what the difference is that's causing the issue. Does anyone have any idea how an issue like this would start happenning 1) only on the Vercel deployment and 2) only on certain Links?
I've done extensive searching online for this problem, and while it's popped up in quite a few places, I haven't found anything that applies to my project specifically.
PS: While my site is publically deployed, it's a WIP with dummy data, to clear up any confusion 😅
It was because I had used /api as the name of the folder for my server actions, and that is a reserved directory with a particular meaning for Vercel functions: https://vercel.com/docs/functions/quickstart#create-an-api-route
I chose a different name for the directory and both the build and Link problems were solved!