项目和标签页配置

配置项目和标签页面：页面文本（PROJECTS_CONFIG、TAGS_CONFIG）、项目内容 frontmatter、文件位置和使用示例。

项目和标签页配置

2025年8月11日

2 mins

419 words

Loading views

项目页面配置h3

配置页面文本：

export const PROJECTS_CONFIG: ProjectConfig = {
  title: 'Projects',
  description: 'The examples of my projects.',
  introduce: 'The examples of my projects.',
}

属性	描述
title	浏览器标签和页面上显示的标题。
description	页面 `head` 元素中的元数据描述。
introduce	页面标题下方的介绍。

项目内容h3

项目页面显示的内容来自 /src/content/projects。

它的写作风格与文章类似：一个 MDX 文件代表一个项目。

项目前置数据h4

示例 (src/content/projects/Litos/index.mdx):

---
name: 'Litos'
description: 'A Simple & Modern Blog Theme for Astro.'
githubUrl: 'https://github.com/Dnzzk2/Litos'
website: 'https://litos.vercel.app/'
type: 'image'
icon: '../../../../public/projects/litos.png'
imageClass: 'w-10 h-10'
star: 32
fork: 7
---

属性	描述
name	项目名称。
description	项目卡片上显示的简短描述。
githubUrl	项目的 GitHub 仓库 URL。
website	项目网站或演示 URL。
type	项目卡片的显示类型。目前，`'image'` 显示缩略图。
icon	项目的图标路径（支持 `public/` 下的路径）。
imageClass	用于调整图片大小的额外类（例如 Tailwind 类）。
star	星标数量（可选）。
fork	分支数量（可选）。

标签页面配置h3

export const TAGS_CONFIG: TagsConfig = {
  title: 'Tags',
  description: 'All tags of Posts',
  introduce: 'All the tags for posts are here, you can click to filter them.',
}

属性	描述
title	浏览器标签和标签统计页面上显示的标题。
description	标签统计页面 `head` 元素中的元数据描述。
introduce	标签统计页面标题下方的介绍。

项目页面配置h3

项目内容h3

项目前置数据h4

标签页面配置h3

Comments