Skip to content

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:

md
<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

{
  "nav": [
    {
      "text": "Home",
      "link": "/"
    },
    {
      "text": "Examples",
      "link": "/markdown-examples"
    },
    {
      "text": "Obsidian",
      "link": "/obsidian"
    }
  ],
  "sidebar": [
    {
      "text": "",
      "collapsible": true,
      "collapsed": false,
      "items": [
        {
          "text": "Notes",
          "collapsible": true,
          "collapsed": false,
          "items": [
            {
              "text": "AWS",
              "collapsible": true,
              "collapsed": false,
              "items": [
                {
                  "text": "AWS",
                  "link": "/Notes/AWS/AWS.md"
                }
              ]
            },
            {
              "text": "Active Directory",
              "collapsible": true,
              "collapsed": false,
              "items": [
                {
                  "text": "Protocols",
                  "link": "/Notes/Active Directory/Protocols.md"
                }
              ]
            },
            {
              "text": "Bug bounty",
              "collapsible": true,
              "collapsed": false,
              "items": [
                {
                  "text": "Programs",
                  "link": "/Notes/Bug bounty/programs.md"
                }
              ]
            },
            {
              "text": "Climbing",
              "link": "/Notes/Climbing.md"
            },
            {
              "text": "Databases",
              "link": "/Notes/Databases.md"
            },
            {
              "text": "Diet",
              "link": "/Notes/Diet.md"
            },
            {
              "text": "Dribble",
              "link": "/Notes/Dribble.md"
            },
            {
              "text": "Etsy",
              "collapsible": true,
              "collapsed": false,
              "items": [
                {
                  "text": "Checklist",
                  "link": "/Notes/Etsy/Checklist.md"
                },
                {
                  "text": "Designs",
                  "link": "/Notes/Etsy/Designs.md"
                },
                {
                  "text": "Etsy+printful+printify",
                  "link": "/Notes/Etsy/Etsy+printful+printify.md"
                },
                {
                  "text": "Etsy",
                  "link": "/Notes/Etsy/Etsy.md"
                },
                {
                  "text": "File characteristics",
                  "link": "/Notes/Etsy/File characteristics.md"
                },
                {
                  "text": "Fly shell",
                  "link": "/Notes/Etsy/Fly shell.md"
                },
                {
                  "text": "Guides",
                  "link": "/Notes/Etsy/Guides.md"
                },
                {
                  "text": "Ideas",
                  "link": "/Notes/Etsy/Ideas.md"
                },
                {
                  "text": "Shopify",
                  "link": "/Notes/Etsy/Shopify.md"
                },
                {
                  "text": "Stores",
                  "link": "/Notes/Etsy/Stores.md"
                }
              ]
            },
            {
              "text": "Fullstack",
              "link": "/Notes/Fullstack.md"
            },
            {
              "text": "General",
              "link": "/Notes/General.md"
            },
            {
              "text": "Goals",
              "link": "/Notes/Goals.md"
            },
            {
              "text": "Google Secops",
              "link": "/Notes/Google Secops.md"
            },
            {
              "text": "HOT",
              "link": "/Notes/HOT.md"
            },
            {
              "text": "Image resizing",
              "link": "/Notes/Image resizing.md"
            },
            {
              "text": "Javascript",
              "link": "/Notes/Javascript.md"
            },
            {
              "text": "Laburo",
              "link": "/Notes/Laburo.md"
            },
            {
              "text": "Linear",
              "link": "/Notes/Linear.md"
            },
            {
              "text": "Math",
              "link": "/Notes/Math.md"
            },
            {
              "text": "Midjourney",
              "link": "/Notes/Midjourney.md"
            },
            {
              "text": "Notes",
              "collapsible": true,
              "collapsed": false,
              "items": [
                {
                  "text": "Data stuff",
                  "link": "/Notes/Notes/Data stuff.md"
                },
                {
                  "text": "Fix",
                  "link": "/Notes/Notes/Fix.md"
                },
                {
                  "text": "More links LOL",
                  "link": "/Notes/Notes/More links LOL.md"
                },
                {
                  "text": "TODO",
                  "link": "/Notes/Notes/TODO.md"
                }
              ]
            },
            {
              "text": "ODOT",
              "link": "/Notes/ODOT.md"
            },
            {
              "text": "Port Swigger",
              "link": "/Notes/Port Swigger.md"
            },
            {
              "text": "Programming",
              "collapsible": true,
              "collapsed": false,
              "items": [
                {
                  "text": "Elixir",
                  "link": "/Notes/Programming/Elixir.md"
                },
                {
                  "text": "ML",
                  "link": "/Notes/Programming/ML.md"
                },
                {
                  "text": "React",
                  "link": "/Notes/Programming/React.md"
                }
              ]
            },
            {
              "text": "Rust",
              "link": "/Notes/Rust.md"
            },
            {
              "text": "Schedule",
              "link": "/Notes/Schedule.md"
            },
            {
              "text": "Security",
              "link": "/Notes/Security.md"
            },
            {
              "text": "Solid hackaton",
              "link": "/Notes/Solid hackaton.md"
            },
            {
              "text": "Cookbooks",
              "link": "/Notes/cookbooks.md"
            },
            {
              "text": "Home",
              "collapsible": true,
              "collapsed": false,
              "items": [
                {
                  "text": "L",
                  "collapsible": true,
                  "collapsed": false,
                  "items": [
                    {
                      "text": "Downloads",
                      "collapsible": true,
                      "collapsed": false,
                      "items": [
                        {
                          "text": "Andriy%20Burkov%20 %20The%20Hundred Page%20Machine%20Learning%20Book Andriy%20Burkov%20(2019).pdf",
                          "link": "/Notes/home/l/Downloads/Andriy%20Burkov%20-%20The%20Hundred-Page%20Machine%20Learning%20Book-Andriy%20Burkov%20(2019).pdf.md"
                        }
                      ]
                    }
                  ]
                }
              ]
            }
          ]
        },
        {
          "text": "Api examples",
          "link": "/api-examples.md"
        },
        {
          "text": "Index",
          "link": "/index.md"
        },
        {
          "text": "Markdown examples",
          "link": "/markdown-examples.md"
        },
        {
          "text": "Proxies",
          "collapsible": true,
          "collapsed": false,
          "items": [
            {
              "text": "AWS",
              "link": "/proxies/AWS.md"
            },
            {
              "text": "Apache",
              "link": "/proxies/Apache.md"
            },
            {
              "text": "Caddy",
              "link": "/proxies/Caddy.md"
            },
            {
              "text": "Cloudflare",
              "link": "/proxies/Cloudflare.md"
            },
            {
              "text": "Envoy",
              "link": "/proxies/Envoy.md"
            },
            {
              "text": "Fastly",
              "link": "/proxies/Fastly.md"
            },
            {
              "text": "Haproxy and Nuster",
              "link": "/proxies/Haproxy-and-Nuster.md"
            },
            {
              "text": "Nginx",
              "link": "/proxies/Nginx.md"
            },
            {
              "text": "Stackpath",
              "link": "/proxies/Stackpath.md"
            },
            {
              "text": "Traefik",
              "link": "/proxies/Traefik.md"
            },
            {
              "text": "Varnish",
              "link": "/proxies/Varnish.md"
            },
            {
              "text": "Index",
              "link": "/proxies/index.md"
            },
            {
              "text": "Labs",
              "collapsible": true,
              "collapsed": false,
              "items": [
                {
                  "text": "README",
                  "link": "/proxies/labs/README.md"
                }
              ]
            }
          ]
        }
      ]
    }
  ],
  "socialLinks": [
    {
      "icon": "github",
      "link": "https://github.com/vuejs/vitepress"
    }
  ],
  "search": {
    "provider": "local"
  }
}

Page Data

{
  "title": "Runtime API Examples",
  "description": "",
  "frontmatter": {
    "outline": "deep"
  },
  "headers": [],
  "relativePath": "api-examples.md",
  "filePath": "api-examples.md"
}

Page Frontmatter

{
  "outline": "deep"
}

More

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