VitePress一月新特性解读

292 阅读3分钟

“开启掘金成长之旅!这是我参与「掘金日新计划 · 2 月更文挑战」的第 1 天,点击查看活动详情

VitePress距离上一个大版本更新已经过去了半年,小版本的更新却一直在进行中,目前正处于alpha状态。

今年一月,VitePress更新非常活跃,共发布release12次。更新状况如下表。

VersionDateBug FixesFeaturesBREAKING CHANGESPerformance Improvements
1.0.0-alpha.452023/1/31✔️
1.0.0-alpha.442023/1/31✔️✔️✔️
1.0.0-alpha.432023/1/29✔️
1.0.0-alpha.422023/1/29✔️
1.0.0-alpha.412023/1/28✔️✔️
1.0.0-alpha.402023/1/20✔️
1.0.0-alpha.392023/1/20✔️
1.0.0-alpha.382023/1/17✔️
1.0.0-alpha.372023/1/17✔️✔️
1.0.0-alpha.362023/1/11✔️✔️
1.0.0-alpha.352023/1/3✔️
1.0.0-alpha.342023/1/1✔️✔️✔️

可以看到,今年一月集中更新在下半月,其中有5次Features,一次BREAKING CHANGES和一次Performance Improvements

我们现在来看一下在一个月内有哪些新功能出现吧。

可嵌套的多级侧边栏

在v1.0.0-alpha.41前,只有一级侧边栏才可以折叠,对于结构复杂的文档非常不方便。现在,VitePress已经支持了最多6级的可嵌套侧边栏,每一级都可折叠。

伴随着这个新特性到来,VitePress的侧边栏UI也发生了较大变化。

支持i18n

从v1.0.0-alpha.41开始,VitePress已经可以支持i18n(国际化)了,利用这个新特性你可以创建不同语言版本的文档,让你的文档更方便被各种语言使用者所阅读。

只需collapsed确定折叠

默认主题的侧边栏有了配置选项collapsible被取消,只需collapsed即可确定侧边栏的折叠情况。

在原有的主题配置中,需通过collapsible控制侧边栏能否折叠,再利用collapsed控制侧边栏的默认折叠状态。collapsibleture时显示折叠按钮,否则不显示。collapsedture时默认折叠,否则默认展开。

在1.0.0-alpha.44版本后,如果在配置文件中通过下面三种情况确定折叠:

  • 不指定collapsed选项,侧边栏是展开且无法折叠的
  • collapsedtrue时,侧边栏是可折叠且被折叠的
  • collapsedfalse时,侧边栏是可折叠且展开的。

更简洁的cleanUrls选项

默认情况下,VitePress解析MarkDown生成Html,URL里会完整展示文件扩展名,如/foo.html,开启cleanUrls选项可以使URL更加简洁,/foo.html可直接使用/foo请求。

在v1.0.0-alpha.41前,这个选项有三种参数'disabled' | 'without-subfolders' | 'with-subfolders',现在它变成了boolean,接受布尔值即可。

可移除右侧边栏标签里的badge文本

默认情况下,标题里的badge文本同样会在侧边栏标签里展示,v1.0.0-alpha.41新增了配置选项outlineBadges,开启后右侧边栏标签里的badge文本将被移除。

空闲时间预连algolia

根据DocSearch的文档显示,将下面这行代码添加在网站上,可以提示浏览器该网站将从Algolia加载数据,并允许它预先连接到DocSearch集群,使得第一次查询的速度更快,尤其是在移动端。

<link rel="preconnect" href="https://YOUR_APP_ID-dsn.algolia.net" crossorigin />

通过window对象的requestIdleCallback方法插入一个函数,可以在浏览器空闲的时候调用这个函数将上面的代码插入head中,从而实现在浏览器空闲时预连algolia。