使用 @theme 来定位要在自定义组件中使用的默认主题中的组件



我正在使用 Vuepress 进行文档,发现自己需要创建自定义页面。

为此,我遵循了 Vuepress 文档,其中描述了您可以使用 YALM 前言来定位不同的组件以用作布局:

---
layout: SpecialLayout
---

但是,当我尝试使用默认主题中的现有组件时,似乎无法导入该组件。

import PageNav from '@theme/components/PageNav.vue'

在 SpecialLayout.vue 中什么都不做,我在自定义组件中看不到它。

我宁愿不弹出,因为我想依赖 Vuepress 默认主题的未来更新。

您可以选择仅创建要自定义的文件(使用现有的组件路径和名称(,也可以创建自己的文件并从自定义SpecialLayout文件中引用它们(如您的情况(

为了更轻松地创建自定义组件,您可以弹出并指定目标目录(/theme 除外(,然后仅克隆/更新需要自定义的内容。

在你的例子中,你需要创建/theme/components/PageNav.vue 和/theme/layout/SpecialLayout.vue。

根据需要为 specialLayout 创建所有自定义标记,或将原始/theme/layout 弹出/克隆为 SpecialLayout,并将导航栏引用替换为自定义 PageNav 组件。

最新更新