フロントマター

使用方法

VitePress では全 Markdown ファイルで YAML フロントマターをサポートし、gray-matter で解析します。フロントマターは Markdown ファイルの先頭に (<script> タグなどの要素よりも前に) 配置する必要があり、三重ダッシュの行で囲まれた有効な YAML の形式になっている必要があります。例:

---
title: Docs with VitePress
editLink: true
---

サイトやデフォルトテーマの設定オプションには、フロントマターに対応するオプションが多くあります。フロントマターを使用して、現在のページのみに限って特定の挙動をオーバーライドできます。詳細については、フロントマターの設定リファレンス を参照してください。

独自のカスタムフロントマターデータを定義し、ページで動的 Vue 式で使用することもできます。

フロントマターデータへのアクセス

フロントマターデータは特別な $frontmatter グローバル変数からアクセスできます

Markdown ファイル内で使用する例を次に示します

---
title: Docs with VitePress
editLink: true
---

# {{ $frontmatter.title }}

Guide content

<script setup> でuseData() ヘルパーを使用して、現在のページのフロントマターデータにアクセスすることもできます。

代替のフロントマターフォーマット

VitePress は JSON フロントマター構文もサポートします。この場合、開始と終了は中かっこになります

---
{
  "title": "Blogging Like a Hacker",
  "editLink": true
}
---