Vuepress README.doc yaml 格式的第一页转换为 markdown 格式的文档
Vuepress README.doc first page in format yaml convert to markdown format doc
我找不到关于如何修改 Vuepress 主页的信息,虽然我喜欢它的结构,但它是 .yaml 格式,不允许我放置链接。
可以放链接吗?
或者更好的是,是否可以将该页面转换为降价格式但保留它提供的输出?
不幸的是,不修改 Vue 模板是不可能的。主页由 Home
component component and it renders the page's frontmatter using Vue's "Mustache" syntax 呈现。胡须内的值只会呈现为纯文本。
您必须通过 "ejecting" the default theme or by creating a custom layout 修改主页的 Home
组件。在这两种情况下,当您升级 Vuepress 时,您显然不会再收到任何组件更新。
我创建了一个 demo to show how to use a custom layout to allow the frontmatter to be HTML. I've copied the Layout
and Home
components from Vuepress and changed the new Home
component to use v-html
来将 HTML 值注入到 h1
组件中。所以现在您的 heroText
可能是 Hi! This is a <a href='https://www.google.com'>link</a>
并且它将在主页上显示为 link。您显然可以对其他元素执行相同的操作。
请务必将主页的 layout
值设置为新布局,例如layout: HomeLayout
.
我找不到关于如何修改 Vuepress 主页的信息,虽然我喜欢它的结构,但它是 .yaml 格式,不允许我放置链接。
可以放链接吗? 或者更好的是,是否可以将该页面转换为降价格式但保留它提供的输出?
不幸的是,不修改 Vue 模板是不可能的。主页由 Home
component component and it renders the page's frontmatter using Vue's "Mustache" syntax 呈现。胡须内的值只会呈现为纯文本。
您必须通过 "ejecting" the default theme or by creating a custom layout 修改主页的 Home
组件。在这两种情况下,当您升级 Vuepress 时,您显然不会再收到任何组件更新。
我创建了一个 demo to show how to use a custom layout to allow the frontmatter to be HTML. I've copied the Layout
and Home
components from Vuepress and changed the new Home
component to use v-html
来将 HTML 值注入到 h1
组件中。所以现在您的 heroText
可能是 Hi! This is a <a href='https://www.google.com'>link</a>
并且它将在主页上显示为 link。您显然可以对其他元素执行相同的操作。
请务必将主页的 layout
值设置为新布局,例如layout: HomeLayout
.