Runtime API Examples

This page demonstrates usage of some of the runtime APIs provided by VitePress.

The main useData() API can be used to access site, theme, and page data for the current page. It works in both .md and .vue files:

<script setup>
import { useData } from 'vitepress'

const { theme, page, frontmatter } = useData()
</script>

## Results

### Theme Data
<pre>{{ theme }}</pre>

### Page Data
<pre>{{ page }}</pre>

### Page Frontmatter
<pre>{{ frontmatter }}</pre>

Results

Theme Data

{
  "logo": "/favicon.svg",
  "search": {
    "provider": "local"
  },
  "darkModeSwitchLabel": "主题",
  "lightModeSwitchTitle": "切换到浅色模式",
  "darkModeSwitchTitle": "切换到深色模式",
  "sidebarMenuLabel": "菜单",
  "returnToTopLabel": "返回顶部",
  "outline": {
    "label": "页面导航"
  },
  "lastUpdated": {
    "text": "最后更新于"
  },
  "docFooter": {
    "prev": "上一页",
    "next": "下一页"
  },
  "externalLinkIcon": true,
  "footer": {
    "message": "Released under the MIT License.",
    "copyright": "Copyright © 2019-present Evan You"
  },
  "nav": [
    {
      "text": "首页",
      "link": "/"
    },
    {
      "text": "导航",
      "link": "/Navigation/General"
    },
    {
      "text": "人工智能",
      "link": "/ArtificialIntelligence/"
    },
    {
      "text": "计算机科学",
      "items": [
        {
          "text": "数据结构和算法",
          "link": "/ComputerScience/DataStructureAndAlgorithm"
        },
        {
          "text": "计算机网络",
          "link": "/ComputerScience/ComputerNetwork"
        },
        {
          "text": "操作系统",
          "link": "/ComputerScience/OperatingSystem"
        }
      ]
    },
    {
      "text": "程序设计",
      "items": [
        {
          "text": "Web前端",
          "link": "/Programming/WebFrontEnd/"
        },
        {
          "text": "Web后端",
          "link": "/Programming/WebBackend"
        },
        {
          "text": "Windows程序设计",
          "link": "/Programming/WindowsProgramming"
        }
      ]
    },
    {
      "text": "虚幻引擎",
      "link": "/UnrealEngine/"
    },
    {
      "text": "界面设计",
      "link": "/InterfaceDesign/"
    },
    {
      "text": "理论物理",
      "link": "/TheoreticalPhysics/"
    }
  ],
  "sidebar": {
    "Navigation": [
      {
        "text": "导航",
        "base": "/Navigation/",
        "items": [
          {
            "text": "通用",
            "link": "General"
          },
          {
            "text": "人工智能",
            "link": "ArtificialIntelligence"
          },
          {
            "text": "计算机科学",
            "link": "ComputerScience"
          },
          {
            "text": "Web",
            "link": "Web"
          },
          {
            "text": "C++",
            "link": "C++"
          },
          {
            "text": "虚幻引擎",
            "link": "UnrealEngine"
          },
          {
            "text": "建站",
            "link": "SiteBuilding"
          },
          {
            "text": "界面设计",
            "link": "InterfaceDesign"
          }
        ]
      }
    ],
    "Examples": [
      {
        "text": "示例",
        "base": "/Examples/",
        "items": [
          {
            "text": "Markdown",
            "link": "Markdown"
          }
        ]
      }
    ],
    "ArtificialIntelligence": [
      {
        "text": "通用",
        "collapsed": false,
        "base": "/ArtificialIntelligence/General/",
        "items": [
          {
            "text": "思考",
            "link": "Think"
          },
          {
            "text": "提示工程",
            "link": "PromptEngineering"
          },
          {
            "text": "视听语言",
            "link": "AudioVisualLanguage"
          }
        ]
      },
      {
        "text": "图像",
        "collapsed": false,
        "base": "/ArtificialIntelligence/Image/",
        "items": [
          {
            "text": "提示词",
            "link": "Prompt"
          }
        ]
      },
      {
        "text": "视频",
        "collapsed": false,
        "base": "/ArtificialIntelligence/Video/",
        "items": [
          {
            "text": "提示词",
            "link": "Prompt"
          }
        ]
      }
    ],
    "Programming/WebFrontEnd": [
      {
        "text": "JavaScript",
        "collapsed": false,
        "base": "/Programming/WebFrontEnd/JavaScript/",
        "items": [
          {
            "text": "Vue",
            "link": "Vue"
          }
        ]
      },
      {
        "text": "浏览器扩展",
        "collapsed": false,
        "base": "/Programming/WebFrontEnd/BrowserExtension/",
        "items": [
          {
            "text": "配置",
            "link": "Config"
          }
        ]
      }
    ],
    "Programming/WebBackend": [
      {
        "text": "Node.js",
        "collapsed": false,
        "base": "/Programming/WebBackend/Nodejs/",
        "items": [
          {
            "text": "打包",
            "link": "Pack"
          },
          {
            "text": "示例",
            "link": "Example"
          }
        ]
      }
    ],
    "/Programming/WindowsProgramming": [
      {
        "base": "/Programming/WindowsProgramming/",
        "items": [
          {
            "text": "基础",
            "link": "Basic"
          },
          {
            "text": "示例",
            "link": "Example"
          }
        ]
      }
    ],
    "TheoreticalPhysics": [
      {
        "base": "/TheoreticalPhysics/",
        "items": [
          {
            "text": "时间简史",
            "link": "/ABriefHistoryOfTime"
          }
        ]
      }
    ]
  },
  "socialLinks": [
    {
      "icon": "github",
      "link": "https://github.com/CodeRonny"
    }
  ]
}

Page Data

{
  "title": "Runtime API Examples",
  "description": "",
  "frontmatter": {
    "outline": "deep"
  },
  "headers": [],
  "relativePath": "Examples/Api.md",
  "filePath": "Examples/Api.md",
  "lastUpdated": 1788872159000
}

Page Frontmatter

{
  "outline": "deep"
}

More

Check out the documentation for the full list of runtime APIs.