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": "https://cdn.jsdelivr.net/gh/themeselection/ts-assets/jetship/jetship-laravel-boilerplate/logo/icon.png",
  "search": {
    "provider": "local"
  },
  "nav": [
    {
      "text": "Guide",
      "link": "/guide/",
      "activeMatch": "/guide/"
    },
    {
      "text": "FAQ",
      "link": "/faq/"
    },
    {
      "text": "Articles",
      "link": "/articles/",
      "activeMatch": "/articles/"
    },
    {
      "text": "Changelog",
      "link": "https://demos.themeselection.com/jetship-laravel-starter-kit/changelog",
      "rel": "referrer"
    },
    {
      "text": "Hire Us",
      "link": "https://themeselection.com/hire-us/",
      "rel": "referrer"
    },
    {
      "text": "Demo",
      "link": "https://demos.themeselection.com/jetship-laravel-starter-kit-demo/",
      "rel": "referrer"
    },
    {
      "text": "Purchase",
      "link": "https://demos.themeselection.com/jetship-laravel-starter-kit/",
      "rel": "referrer"
    }
  ],
  "sidebar": {
    "/guide/": [
      {
        "text": "Welcome",
        "link": "/guide/"
      },
      {
        "text": "Video Tutorials",
        "link": "/guide/video-tutorials"
      },
      {
        "text": "Getting Started",
        "collapsed": false,
        "items": [
          {
            "text": "Installation",
            "link": "/guide/installation"
          },
          {
            "text": "Environment Variables",
            "link": "/guide/environment-variables.html"
          },
          {
            "text": "General Settings",
            "link": "/guide/general-settings",
            "items": [
              {
                "text": "Cookie Consent",
                "link": "/guide/cookies-consent"
              }
            ]
          },
          {
            "text": "reCaptcha",
            "link": "/guide/recaptcha"
          },
          {
            "text": "Translations",
            "link": "/guide/translations"
          },
          {
            "text": "Email Verification",
            "link": "/guide/email-verification"
          },
          {
            "text": "Affiliation",
            "link": "/guide/affiliation"
          },
          {
            "text": "Waitlist",
            "link": "/guide/waitlist"
          },
          {
            "text": "Sitemap",
            "link": "/guide/sitemap"
          }
        ]
      },
      {
        "text": "Resources & Pages",
        "items": [
          {
            "text": "User",
            "link": "/guide/user-management"
          },
          {
            "text": "Blog",
            "link": "/guide/blog"
          },
          {
            "text": "Roadmap",
            "link": "/guide/roadmap"
          },
          {
            "text": "Faqs",
            "link": "/guide/faqs-management"
          }
        ]
      },
      {
        "text": "Dashboard",
        "collapsed": false,
        "items": [
          {
            "text": "Overview",
            "link": "/guide/dashboard-overview"
          },
          {
            "text": "Customization",
            "link": "/guide/dashboard-customization"
          }
        ]
      },
      {
        "text": "Emails",
        "collapsed": false,
        "items": [
          {
            "text": "Email setup",
            "link": "/guide/emails"
          },
          {
            "text": "Email Templates",
            "link": "/guide/email-templates"
          }
        ]
      },
      {
        "text": "Authentication",
        "items": [
          {
            "text": "Authentication",
            "link": "/guide/authentication"
          },
          {
            "text": "Oauth Social Login",
            "link": "/guide/oauth-social-login"
          },
          {
            "text": "Magic Link",
            "link": "/guide/magic-link"
          }
        ]
      },
      {
        "text": "Payment Providers",
        "items": [
          {
            "text": "Overview",
            "link": "/guide/payment-overview"
          },
          {
            "text": "Stripe",
            "link": "/guide/stripe"
          },
          {
            "text": "Lemon Squeezy",
            "link": "/guide/lemon-squeezy"
          },
          {
            "text": "Customer Portal",
            "link": "/guide/customer-portal"
          },
          {
            "text": "Discounts",
            "link": "/guide/discounts"
          }
        ]
      },
      {
        "text": "Customization",
        "items": [
          {
            "text": "Admin",
            "link": "/guide/admin-panel-customization"
          },
          {
            "text": "Theme Customization",
            "link": "/guide/theme-customization"
          },
          {
            "text": "Layouts",
            "link": "/guide/layouts"
          },
          {
            "text": "Pages",
            "link": "/guide/pages"
          },
          {
            "text": "Components",
            "collapsed": true,
            "items": [
              {
                "text": "Overview",
                "link": "/guide/components"
              },
              {
                "text": "Hero Sections",
                "link": "/guide/components/hero-sections"
              },
              {
                "text": "Feature Sections",
                "link": "/guide/components/feature-sections"
              },
              {
                "text": "Additional Features Sections",
                "link": "/guide/components/additional-features-sections"
              },
              {
                "text": "Pricing",
                "link": "/guide/components/pricing"
              },
              {
                "text": "FAQ Sections",
                "link": "/guide/components/faq"
              },
              {
                "text": "Reviews",
                "link": "/guide/components/reviews"
              },
              {
                "text": "Newsletter",
                "link": "/guide/components/newsletter"
              },
              {
                "text": "Footer",
                "link": "/guide/components/footer"
              },
              {
                "text": "Misc",
                "link": "/guide/components/misc"
              }
            ]
          }
        ]
      },
      {
        "text": "Deployment",
        "items": [
          {
            "text": "Product Launch Checklist",
            "link": "/guide/product-launch-checklist"
          },
          {
            "text": "Manual",
            "link": "/guide/deployment-manual"
          },
          {
            "text": "Laravel Forge",
            "link": "/guide/deployment-laravel-forge"
          }
        ]
      }
    ]
  },
  "footer": {
    "copyright": "COPYRIGHT © 2020-Present ThemeSelection, All rights Reserved"
  }
}

Page Data

{
  "title": "Runtime API Examples",
  "description": "",
  "frontmatter": {
    "outline": "deep",
    "head": [
      [
        "link",
        {
          "rel": "canonical",
          "href": "https://demos.themeselection.com/jetship-laravel-starter-kit/documentation/api-examples.html"
        }
      ]
    ]
  },
  "headers": [],
  "relativePath": "api-examples.md",
  "filePath": "api-examples.md"
}

Page Frontmatter

{
  "outline": "deep",
  "head": [
    [
      "link",
      {
        "rel": "canonical",
        "href": "https://demos.themeselection.com/jetship-laravel-starter-kit/documentation/api-examples.html"
      }
    ]
  ]
}

More

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