我们很高兴宣布 AstroPaper v3 的发布,其中包含新功能、增强功能和错误修复,以提升您的 Web 开发体验。让我们深入了解此版本的亮点:

目录
功能和变化
Astro v3 集成
AstroPaper 现在完全支持 Astro v3,提供改进的性能和渲染速度。
此外,我们添加了对 Astro 的 ViewTransitions API 的支持,允许您在视图之间创建迷人和动态的过渡。
在”最近部分”中,只会显示非精选文章,以避免重复并更好地支持 ViewTransitions API。
更新 OG 图片生成逻辑

我们更新了自动 OG 图片生成的逻辑,使其更加可靠和高效。此外,它现在支持文章标题中的特殊字符,确保准确、灵活和引人注目的社交媒体预览。
SITE.ogImage 现在是可选的。如果未指定,AstroPaper 将使用 SITE.title、SITE.desc 和 SITE.website 自动生成 OG 图片
主题元标签
已添加 theme-color 元标签以动态适应主题切换,确保无缝的用户体验。
注意顶部的差异
AstroPaper v2 主题切换
AstroPaper v3 主题切换
其他变化
Astro Prettier 插件
Astro Prettier 插件已开箱即用地安装,以保持项目整洁有序。
次要样式更改
单行代码块换行问题已解决,使您的代码片段看起来一尘不染。
更新导航样式 CSS 以允许向导航添加更多导航链接。
升级到 AstroPaper v3
本节仅适用于那些想要从旧版本升级 AstroPaper v3 的人。
本节将帮助您从 AstroPaper v2 迁移到 AstroPaper v3。
在阅读本节的其余部分之前,您可能还想查看这篇文章以了解如何升级依赖项和 AstroPaper。
选项 1:全新开始(推荐)
在此版本中,进行了大量更改_用较新的 API 替换旧的 Astro API、错误修复、新功能等。因此,如果您是没有进行太多自定义的人,您应该遵循这种方法。
步骤 1:保留所有已更新的文件
保留所有已更新的文件很重要。这些文件包括
/src/config.ts(在 v3 中没有触及)/src/styles/base.css(在 v3 中进行了少量更改;如下所述)/src/assets/(在 v3 中没有触及)/public/assets/(在 v3 中没有触及)/content/blog/(这是您的博客内容目录 🤷🏻♂️)- 您所做的任何其他自定义。
/* file: /src/styles/base.css */
@layer base {
/* Other Codes */
::-webkit-scrollbar-thumb:hover {
@apply bg-skin-card-muted;
}
/* Old code
code {
white-space: pre;
overflow: scroll;
}
*/
/* New code */
code,
blockquote {
word-wrap: break-word;
}
pre > code {
white-space: pre;
}
}
@layer components {
/* other codes */
}
步骤 1:用 AstroPaper v3 替换其他所有内容
在此步骤中,替换所有内容_除了上述文件/目录(加上您自定义的文件/目录)_使用 AstroPaper v3。
步骤 3:架构更新
请记住,/src/content/_schemas.ts 已被 /src/content/config.ts 替换。
此外,/src/content/config.ts 不再导出 BlogFrontmatter 类型。
因此,文件内的所有 BlogFrontmatter 类型都需要更新为 CollectionEntry<"blog">["data"]。
例如:src/components/Card.tsx
// AstroPaper v2
import type { BlogFrontmatter } from "@content/_schemas";
export interface Props {
href?: string;
frontmatter: BlogFrontmatter;
secHeading?: boolean;
}
// AstroPaper v3
import type { CollectionEntry } from "astro:content";
export interface Props {
href?: string;
frontmatter: CollectionEntry<"blog">["data"];
secHeading?: boolean;
}
选项 2:使用 Git 升级
大多数用户不推荐使用这种方法。如果可以,您应该执行”选项 1”。只有在您知道如何解决合并冲突并且知道自己在做什么时才这样做。
实际上,我已经为这种情况写了一篇博客文章,您可以在这里查看。
结尾
准备好探索 AstroPaper v3 中令人兴奋的新功能和改进了吗?立即开始使用 AstroPaper。
有关其他错误修复和集成更新,请查看发行说明以了解更多信息。
如果您在升级过程中遇到任何错误或遇到困难,请随时在 GitHub 上打开问题或开始讨论。