vercel: 404 on dynamic routes in monorepo with now dev

Bug report

Describe the bug

When running Next.js in a subfolder of a monorepo, dynamic routes trigger a 404 when running now dev. This only happens when the route is directly loaded (using the url or refreshing the page). It does not happen when you navigate clientside using <Link>. Redirects are specified in the now.json to make it work with a monorepo.

To Reproduce

Repo: https://github.com/baukevanderlaan/now-next-dynamic-404

  1. npm install in the web folder
  2. now dev in the root
  3. Click a link to a dynamic page
  4. Refresh the page to get a 404

Expected behavior

No 404.

System information

  • OS: macOS
  • Next.js: 9.3.4
  • Now CLI: 17.1.1

About this issue

  • Original URL
  • State: closed
  • Created 4 years ago
  • Reactions: 26
  • Comments: 22 (4 by maintainers)

Commits related to this issue

Most upvoted comments

@baukevanderlaan I understand the confusion, the issue was in the @vercel/next builder. by installing now@19.1.2-canary-3 you upgraded the cli package but by default it is still going to pull normal releases of the builders. change your {now,vercel}.json to use @{now,vercel}/next@canary instead of @{now,vercel}/next for your next js build and the issue should be resolved.

I’m having the same issue with dynamic routes 404’ing in a monorepo setup. This is my now.json, which has been working fine up until recently. Wondering if I’m missing some crucial “routes” config, but can’t figure it out from the docs.

{
  "version": 2,
  "builds": [
    { "src": "ui/next.config.js", "use": "@now/next" },
    { "src": "api/index.js", "use": "@now/node" }
  ],
  "routes": [
    { "src": "/api", "dest": "/api/index.js" },
    { "src": "/(.*)", "dest": "/ui/$1", "continue": true }
  ],
}

For anyone finding this thread, modeling their monorepo after this example: https://github.com/vercel/next.js/tree/canary/examples/with-zones

I replaced blog and home with the folders old and new

I was able to get dynamic routes working by adding "continue": true to my vercel.json "routes" config, like so:

    { "src": "/new/_next(.*)", "dest": "new/_next$1" },
    { "src": "/login(.*)", "dest": "new/login$1" },
    { "src": "/(.*)", "dest": "old/$1", "continue": true }

#4510 doesn’t touch anything with regards to production behaviour and clearly there are issues which remain, see https://github.com/vercel/vercel/pull/4510#issuecomment-645978269 and I think are related to https://github.com/vercel/next.js/issues/12851

I am not sure it would be related to your preview issue though : we use preview too with prismic and haven’t encountered any such issues.

We’re encountering this as well. Something’s not playing well with monorepos.

My static pages render fine, but any dynamic or server-side rendered pages 404 immediately.

Our now.json file is right here: https://github.com/livepeer/livepeerjs/blob/master/now.json

Thanks your input Takeshi!

If I’m not mistaken, that would work only if the repository contains nothing but a Next.js app. In my case I have a monorepo with different apps that I’d like to deploy all at once.

hello,

i got same problem. and could be resolved without rewrites at now.json

  1. open vercel console.
  2. change configration other => Next.js at Setting => Project Settings => General => Build & Development Settings => Framework Preset
  3. npm run dev
// package.json

"scripts": {
  "dev": "vercel dev"
},

i hope this helps you. thank you

Got the same problem. If I may add something: for this happens only when I’m running now dev. On production environments, everything works fine

I was checking out the next.js examples when I stumbled on with-zone.

This example is very interesting,it sports :

  • a vercel.json
  • 2 nested nextjs apps (/blog and /home)
  • a dynamic route in /blog
  • it uses routes instead of the more recent rewrites

Where it becomes really intriguing :

  • the dynamic route in /blog works just fine
  • adding a dynamic route in /home triggers the 404
  • switching from routes to rewrites totally breaks /blog (dynamic and fixed routes both)

Thats with the latest vercel release which includes https://github.com/vercel/vercel/pull/4644