跳至主要內容

博客功能介绍

大约 2 分钟博客博客介绍

主题通过引入 @vuepress/plugin-blog 提供了博客支持,该功能是默认禁用的。

如果你需要博客功能,你可以在主题选项中设置 plugins.blog: true 来启用博客功能。

介绍

启用博客功能后,主题允许你通过页面的 frontmatter,为页面配置分类、标签、是否是文章、是否出现在时间线中、星标、置顶等功能。

案例

这里有一个案例open in new window 以便你预览使用 vuepress-theme-hope 构建的博客站点。

多语言支持

主题已为博客系统适配多语言。你可以在主题选项中通过 locales 选项,分别为每一种语言指定属于自己的博客配置。

当你配置了多语言后,每个语言下的文章列表、时间线等会保持独立。

侧边栏

主题提供了一个博客相关的侧边栏。该侧边栏会在博客相关的页面显示 (在桌面会显示在右侧,在移动视图下收起到侧边栏中)

你可以在主题设置中通过 blog.sidebarDisplay 控制该侧边栏在非博客相关的页面的显示行为。可选的值有 "mobile" | "none" | "always"。默认为 "mobile",即当你在移动视图下访问非博客相关的页面时,你也可以在侧边栏看到它。

分页配置

对于所有页面的文章列表,我们都会在底部显示一个分页组件。你可以通过这个组件快捷的在首页、尾页、前后两页进行跳转。你也可以输入数字跳转到指定页面。

默认每个分页的文章数为 10,你可以在主题设置中配置 blog.articlePerPage 来覆盖它。

限制

热更新默认禁用

出于性能考虑,博客相关数据在开发服务器下默认不启用热更新,也就是如果你新增了文章或者修改了已有文章的分类、时间、标签、置顶、星标状态等,整个站点的相关数据仅会在重启开发服务器后更新。

此外,由于博客信息会写入 VuePress 底层数据,修改这一文件会导致开发服务器重启,所以对于 Markdown 内容敏感的阅读时间 (含字数信息) 也不会在开发服务器下生效

如果你希望实时更新这些内容,你需要设置 hotReload: true 并接受每次修改会触发页面刷新以及由于大量重新计算工作带来的一段白屏时间。