Mismatch of dynamic route with multiple parameters when one contains hyphens

[phortuin]

What version of astro are you using?

2.5.6

Are you using an SSR adapter? If so, which one?

None

What package manager are you using?

npm

What operating system are you using?

MacOS Ventura 13.4

What browser are you using?

Chrome latest

Describe the Bug

For a slug with hyphens: my-first-blog: if I name my page [id]-[slug].astro the dynamic route will be matched. If I name my page [slug]-[id].astro it will not be matched. In that latter version I think Astro matches my- and then expects an id instead of first-blog.

// [id]-[slug].astro
export async function getStaticPaths() {
  const posts = await getCollection("posts");
  return posts.map((post) => ({
    params: { slug: post.slug, id: 1 },
    props: { post },
  }));
}

The above code works perfectly fine. If I change the file name to [slug]-[id].astro, I get a 404 on that route my-first-blog-1 and the Astro CLI will say

A `getStaticPaths()` route pattern was matched, but no matching static path was found for requested path `/my-first-post-1`. Possible dynamic routes being matched: src/pages/[slug]-[id].astro.

I can imagine this is expected behaviour, but there's nothing in the docs or some sort of hint in errors that tells you to set up your route differently (an effective fix is creating the whole slug inside getStaticPaths(): slug: `${post.slug}-${post.id}` but I'd rather go by the book). Thanks!

PS in the stackblitz example, if you rename the route to [slug]-[id].astro you will reproduce this behaviour.

Link to Minimal Reproducible Example

https://stackblitz.com/edit/astro-custom-slugs-smqxwc?file=src%2Fpages%2Findex.astro

Participation

• I am willing to submit a pull request for this issue.