Error: Catch-all must be the last part of the URL when using opengraph-image.tsx inside a catch-all route #48162
Description
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 Version 22.3.0: Mon Jan 30 20:38:37 PST 2023; root:xnu-8792.81.3~2/RELEASE_ARM64_T6000
Binaries:
Node: 16.16.0
npm: 8.19.3
Yarn: 1.22.19
pnpm: 7.13.5
Relevant packages:
next: 13.3.1-canary.3
eslint-config-next: 13.3.0
react: 18.2.0
react-dom: 18.2.0Which area(s) of Next.js are affected? (leave empty if unsure)
App directory (appDir: true), Metadata (metadata, generateMetadata, next/head, head.js)
Link to the code that reproduces this issue
https://github.com/EuroPython/website/tree/fa47fe9a3d7a732d9536ed0200dfe9b3f992565a
(newer version have a "workaround")
To Reproduce
in the repo above try to do npm install and then npm run dev, you should get an error
Describe the Bug
When using opengraph-image.tsx inside app/[...parts]/ I get the following error:
ready - started server on 0.0.0.0:3000, url: http://localhost:3000
warn - You have enabled experimental feature (appDir) in next.config.js.
warn - Experimental features are not covered by semver, and may cause unexpected or broken application behavior. Use at your own risk.
info - Thank you for testing `appDir` please leave your feedback at https://nextjs.link/app-feedback
event - compiled client and server successfully in 2.2s (371 modules)
wait - compiling...
Error: Catch-all must be the last part of the URL.
at UrlNode._insert (/Users/patrick/github/europython/website/node_modules/next/dist/shared/lib/router/utils/sorted-routes.js:54:19)
at UrlNode._insert (/Users/patrick/github/europython/website/node_modules/next/dist/shared/lib/router/utils/sorted-routes.js:136:40)
at UrlNode.insert (/Users/patrick/github/europython/website/node_modules/next/dist/shared/lib/router/utils/sorted-routes.js:8:14)
at /Users/patrick/github/europython/website/node_modules/next/dist/shared/lib/router/utils/sorted-routes.js:159:46
at Array.forEach (<anonymous>)
at Object.getSortedRoutes (/Users/patrick/github/europython/website/node_modules/next/dist/shared/lib/router/utils/sorted-routes.js:159:21)
at Watchpack.<anonymous> (/Users/patrick/github/europython/website/node_modules/next/dist/server/dev/next-dev-server.js:544:55) {
type: 'Error'
}
removing opengraph-image.tsx fixes the issue.
Expected Behavior
I should be able to use opengraph-image.tsx inside a catch-all route
Which browser are you using? (if relevant)
No response
How are you deploying your application? (if relevant)
No response