文章
构建这个双语静态站
记录 Ying Blog 当前已经实现的技术取舍:Vite+、Vue、SSG、Markdown 和内容注册表。
Ying Blog 当前已经实现的目标不是追求复杂平台,而是建立一个可以长期维护的静态内容系统。它覆盖博客、文档、项目展示和关于页,并且让中文与英文内容保持结构一致。
这不是 VitePress 项目。站点使用 Vite+ 作为工具链方向,应用层由 Vue、TypeScript、SSG 和 Markdown 内容系统组成。
为什么使用内容注册表
所有公开页面都应该来自同一份规范化内容数据。这样可以避免路由、导航、SEO、RSS 和 sitemap 各自实现一套规则。
export interface ContentEntry {
locale: "zh" | "en";
slug: string;
title: string;
description: string;
path: string;
}
内容注册表会在构建前检查 slug、locale、标题、描述、日期、分类和标签。缺少对应语言内容时,构建会失败。
flowchart LR Markdown["Markdown 内容"] --> Registry["内容注册表"] Config["项目与站点配置"] --> Registry Registry --> Routes["静态路由"] Registry --> Feed["RSS / Sitemap"] Registry --> Pages["SSG 页面"]
读者体验优先
这个站点的视觉方向是安静、清晰和易读,而不是营销式 landing page。文档页应该适合快速扫描,文章页应该适合长时间阅读。
浅色模式保持明亮背景、清楚边界和温和强调色,优先服务长文阅读。
暗色模式降低大面积对比度,同时保证代码块、链接和导航状态可辨识。
当前实现边界
内容入口
Posts、Docs 和 About 由 Markdown 驱动,Projects 由集中配置驱动卡片展示。
构建输出
构建会生成静态 HTML、RSS、sitemap、robots 和 404 页面,并通过验证脚本检查关键产物。
受控能力
CMS、评论、分析、搜索、草稿、生成社交图和项目详情页不属于当前实现范围。
Vue TypeScript SSG