I have this file in src/pages/[...slug].astro:
---
import ContentLayout from '@layouts/ContentPage.astro';
import { getCollection, type CollectionEntry } from 'astro:content';
interface Props {
info: CollectionEntry<'info'>;
}
export const getStaticPaths = async () => {
const entries = await getCollection('info');
return entries.map((info) => ({
params: { slug: info.slug },
props: { info },
}));
};
const { info } = Astro.props;
const { Content } = await info.render();
---
<ContentLayout {...info.data}>
<Content />
</ContentLayout>
Which works okay. If I try to access /about, which has the following structure: (src/content/info/about.md)
---
title: About
pageTitle: About
description: Dummy description for "About" page
---
Dummy about page text
then I see Astro rendering this properly.
However, if I try to access /, which has the following structure: (src/content/info/index.md)
---
title: Home
pageTitle: Home test
description: Home page for my site.
---
## Home
Dummy description for "Home" page
[Dummy link](https://google.com)
I get the following warning in Astro:
04:08:35 [404] / 126ms
04:13:19 [WARN] [router] A `getStaticPaths()` route pattern was matched, but no matching static path was found for requested path `/`.
Possible dynamic routes being matched: src/pages/[...slug].astro.```
and the user sees a 404 Page not found error.