4.0.2-beta如何使文章链接中包含年份

[Invisibox]

就像 domain.com/blog/2025/my-post 这样的格式。
之前的版本可以把 [slug].astro 改名为 [...slug].astro 来解决这个问题，现在这个版本该如何解决呢

[cworld1]

之前的版本可以把 [slug].astro 改名为 [...slug].astro 来解决这个问题

之前可以，现在也应该可以吧？astro 自动加这个前缀的话就需要改代码了：

此处本来为接收并返回 font matter 的，你需要：

1. 新增 slugWithYear
2. 改成函数体，先把对应 slugWithYear 赋值后再返回
3. [...slug].astro 匹配改成 [...slugWithYear].astro 匹配。该文件内容亦然。不懂的话我可以展开写进文档。

[Invisibox]

那就麻烦你了，我的水平有限，按照你的思路改完了并没有生效。
多谢你了大佬！

[cworld1]

实现方案

1. [手动] blog 目录下建立 2024、2025 等文件夹，再在内部塞入对应文件。

2. 从 content collection id 下手

   a. [自动] 经测试在 define 文件中没有暴露 id，故的确不可行
   b. [手动] 使用 custom ids 手动定义，但较为复杂麻烦

3. [自动] 使用 dynamic routes 双层匹配。具体说明见后文。

Dynamic routes

改写匹配规则 [...id].astro 为：

src/pages/[year]/[id].astro

---
import { render, type CollectionEntry } from 'astro:content'

import { getBlogCollection, sortMDByDate } from 'astro-pure/server'
import PostLayout from '@/layouts/BlogPost.astro'

export const prerender = true

export async function getStaticPaths() {
  const posts = sortMDByDate(await getBlogCollection())
  return posts.map((post) => ({
    params: {
      id: post.id,
      // When publishDate exists, add year to the path detection
      ...(post.data.publishDate && {
        year: new Date(post.data.publishDate).getFullYear().toString()
      })
    },
    props: { post, posts }
  }))
}

type Props = {
  post: CollectionEntry<'blog'>
  posts: CollectionEntry<'blog'>[]
}

const { post, posts } = Astro.props
const { Content, headings, remarkPluginFrontmatter } = await render(post)
---

<PostLayout {post} {posts} {headings} {remarkPluginFrontmatter}>
  <Content />
</PostLayout>

将 PostPreview 组件重写（原文件为 https://github.com/cworld1/astro-theme-pure/blob/v4.0.1-beta/packages/pure/components/pages/PostPreview.astro ，改写时注意代码对应版本号）：

src/components/PostPreview.astro

---
// ...
const year = post.data.publishDate ? new Date(post.data.publishDate).getFullYear().toString() : ''
---

<li {/* some attributes */}>
  <a {/* some attributes */}
    href={`/blog/${year}/${id}`}
    data-astro-prefetch
  >
  {/* ... */}
</li>

由此实现自动匹配到日期。