[Next.js App Router] Dynamic segment 404 on Vercel, but not local production build

Hello! I've been facing an issue on a production/preview Vercel instance of my app.

On build, I have

generateStaticParams

generateStaticParams

generateStaticParams

generateStaticParams to generate my routes at build time. The expected behavior though is that the routes are to be dynamically generated for future changes with data (i.e. a new date being returned from

getDailyTitleDates()

getDailyTitleDates()

getDailyTitleDates()

getDailyTitleDates())

export async function generateStaticParams() {
  const dates: string[] = await getDailyTitleDates();

  return dates.map((date: string) => ({
    date,
  }));
}

export async function generateStaticParams() {
  const dates: string[] = await getDailyTitleDates();

  return dates.map((date: string) => ({
    date,
  }));
}

export async function generateStaticParams() {
  const dates: string[] = await getDailyTitleDates();

  return dates.map((date: string) => ({
    date,
  }));
}

export async function generateStaticParams() {
  const dates: string[] = await getDailyTitleDates();

  return dates.map((date: string) => ({
    date,
  }));
}

This is not the case as I'm getting

404

404ed on Vercel.

However, I did

next build

next build

next build

next build and

next start

next start

next start

next start locally and the expected behavior is happening.

I've tried researching on my own what issue I could be having. I do believe I understand the docs, but there's something I could be missing here.

Any help is appreciated!

Solution

https://github.com/vercel/next.js/issues/51009

GitHub

App Router page with data fetching returns 404 in combination with ...

Verify canary release I verified that the issue exists in the latest Next.js canary release Provide environment information Operating System: Platform: darwin Arch: arm64 Version: Darwin Kernel Ver...

Jump to solution

JuaniS•7/11/23, 12:31 AM

having same problem but with normal routes when I hot reload

Sturlen•7/11/23, 2:00 PM

I'd start by looking at

getDailyTitleDates()

getDailyTitleDates()

and making sure it returns the same data on both dev and prod, otherwise it could be generatic different sets of routes

JuaniS•7/11/23, 2:07 PM

It seems like it was a problem with next-intl

Solution

JuaniS•7/11/23, 2:08 PM

https://github.com/vercel/next.js/issues/51009

GitHub

App Router page with data fetching returns 404 in combination with ...

JuaniS•7/11/23, 2:08 PM

I removed it and it started working perfectly

JJuaniS It seems like it was a problem with next-intl

anthonyOP•7/11/23, 3:22 PM

interesting! that explains why im seeing /en//en/ in front of routes in vercel logs

anthonyOP•7/11/23, 3:23 PM

but i see this comment in my next config

/**
   * If you have `experimental: { appDir: true }` set, then you must comment the below `i18n` config
   * out.
   *
   * @see https://github.com/vercel/next.js/issues/41980
   */

/**
   * If you have `experimental: { appDir: true }` set, then you must comment the below `i18n` config
   * out.
   *
   * @see https://github.com/vercel/next.js/issues/41980
   */

but since i don't have expirimental: { appDir: true }expirimental: { appDir: true } set (but im using app dir), is this what could be conflicting?

JuaniS•7/11/23, 3:55 PM

Following the next-intl config it should't be needed if you translate form the client side, which was the one that I was using and I still had this problem. So i dont think this is the problem

anthonyOP•7/11/23, 10:03 PM

gotcha

JJuaniS I removed it and it started working perfectly

anthonyOP•7/12/23, 2:09 PM

can confirm that this resolved my issue as well. thanks for pointing this out!

[Next.js App Router] Dynamic segment 404 on Vercel, but not local production build

Similar Threads

Similar Threads

Similar Threads