Expose an API to retrieve the frontmatter and outline of any page

Is your feature request related to a problem? Please describe.

We’d like to generate a FAQ index page that lists questions from subpages.

For instance, let’s say we have 8 topics, and each topic has 5-15 questions and answers. Each topic would be a dedicated page with the topic name as the title in its frontmatter, and the questions as H2 headings.

We’d like to generate an index page where the content looks like:

1. [Topic A](./faq/topic-a)
    - [How do I do X?](./faq/topic-a#how-do-i-do-x)
    - [What about Y?](./faq/topic-a#what-about-y)
    - …
2. [Topic B](./faq/topic-b)
    - [Is it any good?](./faq/topic-b#is-it-any-good)
    - [Can I cancel at any time?](./faq/topic-b#can-i-cancel-at-any-time)
    - …

etc.

(Shown as Markdown for brevity, but it could be a JS structure that we pass to a Vue component to render lists of links.)

Describe the solution you’d like

Ideally importing any .md file would return an object with enriched metadata such as the frontmatter, body in Markdown and HTML, and ideally outline data too.

This might not be desirable, so maybe an API provided by VitePress that takes a Markdown file path or the raw contents of a Markdown file and returns that data would be preferable? Or methods to extract specific data only (frontmatter, raw body, outline…).

Describe alternatives you’ve considered

We can hard-code the list of links, but we’ll have to manually maintain it and make sure that it is always in sync with the actual content. Any slight change to how a question is worded would make the link in the index broken.

We already do that for the main navigation, which is already a pain. We’d like to avoid extra pain. 😁

Additional context

No response

Validations

• Follow our Code of Conduct
• Read the docs.
• Read the Contributing Guidelines.
• Check that there isn’t already an issue that asks for the same feature to avoid creating a duplicate.

[brc-dd]

We actually have that, it isn’t exactly exposed (documented) though.

Some stuff like this can give you another page’s data:

import { __pageData as foo } from './foo.md'

console.log(foo)

For ts you’ll need to do this:

declare module '*.md' {
  import type { Component } from 'vue'
  import type { PageData } from 'vitepress'

  const component: Component
  const __pageData: PageData

  export default component
  export { __pageData }
}

[fvsch]

Thanks for the answer!

It would be good to have it documented indeed, though there’s always the downside of documenting a private API and turning it into a de-facto public API. ⚖️