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

{
  "logo": {
    "src": "/nueui-logo-mini.svg",
    "width": 24,
    "height": 24
  },
  "socialLinks": [
    {
      "icon": "github",
      "link": "https://github.com/nuecms/nueui"
    }
  ],
  "search": {
    "provider": "algolia",
    "options": {
      "appId": "N5BJZE25C1",
      "apiKey": "87da9a1ba26a2ca02c457887a53b115d",
      "indexName": "nueui",
      "locales": {
        "zh": {
          "placeholder": "搜索文档",
          "translations": {
            "button": {
              "buttonText": "搜索文档",
              "buttonAriaLabel": "搜索文档"
            },
            "modal": {
              "searchBox": {
                "resetButtonTitle": "清除查询条件",
                "resetButtonAriaLabel": "清除查询条件",
                "cancelButtonText": "取消",
                "cancelButtonAriaLabel": "取消"
              },
              "startScreen": {
                "recentSearchesTitle": "搜索历史",
                "noRecentSearchesText": "没有搜索历史",
                "saveRecentSearchButtonTitle": "保存至搜索历史",
                "removeRecentSearchButtonTitle": "从搜索历史中移除",
                "favoriteSearchesTitle": "收藏",
                "removeFavoriteSearchButtonTitle": "从收藏中移除"
              },
              "errorScreen": {
                "titleText": "无法获取结果",
                "helpText": "你可能需要检查你的网络连接"
              },
              "footer": {
                "selectText": "选择",
                "navigateText": "切换",
                "closeText": "关闭",
                "searchByText": "搜索提供者"
              },
              "noResultsScreen": {
                "noResultsText": "无法找到相关结果",
                "suggestedQueryText": "你可以尝试查询",
                "reportMissingResultsText": "你认为该查询应该有结果?",
                "reportMissingResultsLinkText": "点击反馈"
              }
            }
          }
        },
        "pt": {
          "placeholder": "Pesquisar documentos",
          "translations": {
            "button": {
              "buttonText": "Pesquisar",
              "buttonAriaLabel": "Pesquisar"
            },
            "modal": {
              "searchBox": {
                "resetButtonTitle": "Limpar pesquisa",
                "resetButtonAriaLabel": "Limpar pesquisa",
                "cancelButtonText": "Cancelar",
                "cancelButtonAriaLabel": "Cancelar"
              },
              "startScreen": {
                "recentSearchesTitle": "Histórico de Pesquisa",
                "noRecentSearchesText": "Nenhuma pesquisa recente",
                "saveRecentSearchButtonTitle": "Salvar no histórico de pesquisas",
                "removeRecentSearchButtonTitle": "Remover do histórico de pesquisas",
                "favoriteSearchesTitle": "Favoritos",
                "removeFavoriteSearchButtonTitle": "Remover dos favoritos"
              },
              "errorScreen": {
                "titleText": "Não foi possível obter resultados",
                "helpText": "Verifique a sua conexão de rede"
              },
              "footer": {
                "selectText": "Selecionar",
                "navigateText": "Navegar",
                "closeText": "Fechar",
                "searchByText": "Pesquisa por"
              },
              "noResultsScreen": {
                "noResultsText": "Não foi possível encontrar resultados",
                "suggestedQueryText": "Você pode tentar uma nova consulta",
                "reportMissingResultsText": "Deveriam haver resultados para essa consulta?",
                "reportMissingResultsLinkText": "Clique para enviar feedback"
              }
            }
          }
        },
        "ja": {
          "placeholder": "Поиск в документации",
          "translations": {
            "button": {
              "buttonText": "Поиск",
              "buttonAriaLabel": "Поиск"
            },
            "modal": {
              "searchBox": {
                "resetButtonTitle": "Сбросить поиск",
                "resetButtonAriaLabel": "Сбросить поиск",
                "cancelButtonText": "Отменить поиск",
                "cancelButtonAriaLabel": "Отменить поиск"
              },
              "startScreen": {
                "recentSearchesTitle": "История поиска",
                "noRecentSearchesText": "Нет истории поиска",
                "saveRecentSearchButtonTitle": "Сохранить в истории поиска",
                "removeRecentSearchButtonTitle": "Удалить из истории поиска",
                "favoriteSearchesTitle": "Избранное",
                "removeFavoriteSearchButtonTitle": "Удалить из избранного"
              },
              "errorScreen": {
                "titleText": "Невозможно получить результаты",
                "helpText": "Вам может потребоваться проверить подключение к Интернету"
              },
              "footer": {
                "selectText": "выбрать",
                "navigateText": "перейти",
                "closeText": "закрыть",
                "searchByText": "поставщик поиска"
              },
              "noResultsScreen": {
                "noResultsText": "Нет результатов для",
                "suggestedQueryText": "Вы можете попытаться узнать",
                "reportMissingResultsText": "Считаете, что поиск даёт ложные результаты?",
                "reportMissingResultsLinkText": "Нажмите на кнопку «Обратная связь»"
              }
            }
          }
        },
        "es": {
          "placeholder": "Buscar documentos",
          "translations": {
            "button": {
              "buttonText": "Buscar",
              "buttonAriaLabel": "Buscar"
            },
            "modal": {
              "searchBox": {
                "resetButtonTitle": "Limpiar búsqueda",
                "resetButtonAriaLabel": "Limpiar búsqueda",
                "cancelButtonText": "Cancelar",
                "cancelButtonAriaLabel": "Cancelar"
              },
              "startScreen": {
                "recentSearchesTitle": "Historial de búsqueda",
                "noRecentSearchesText": "Ninguna búsqueda reciente",
                "saveRecentSearchButtonTitle": "Guardar en el historial de búsqueda",
                "removeRecentSearchButtonTitle": "Borrar del historial de búsqueda",
                "favoriteSearchesTitle": "Favoritos",
                "removeFavoriteSearchButtonTitle": "Borrar de favoritos"
              },
              "errorScreen": {
                "titleText": "No fue posible obtener resultados",
                "helpText": "Verifique su conexión de red"
              },
              "footer": {
                "selectText": "Seleccionar",
                "navigateText": "Navegar",
                "closeText": "Cerrar",
                "searchByText": "Busqueda por"
              },
              "noResultsScreen": {
                "noResultsText": "No fue posible encontrar resultados",
                "suggestedQueryText": "Puede intentar una nueva búsqueda",
                "reportMissingResultsText": "Deberian haber resultados para esa consulta?",
                "reportMissingResultsLinkText": "Click para enviar feedback"
              }
            }
          }
        },
        "ko": {
          "placeholder": "문서 검색",
          "translations": {
            "button": {
              "buttonText": "검색",
              "buttonAriaLabel": "검색"
            },
            "modal": {
              "searchBox": {
                "resetButtonTitle": "검색 지우기",
                "resetButtonAriaLabel": "검색 지우기",
                "cancelButtonText": "취소",
                "cancelButtonAriaLabel": "취소"
              },
              "startScreen": {
                "recentSearchesTitle": "검색 기록",
                "noRecentSearchesText": "최근 검색 없음",
                "saveRecentSearchButtonTitle": "검색 기록에 저장",
                "removeRecentSearchButtonTitle": "검색 기록에서 삭제",
                "favoriteSearchesTitle": "즐겨찾기",
                "removeFavoriteSearchButtonTitle": "즐겨찾기에서 삭제"
              },
              "errorScreen": {
                "titleText": "결과를 가져올 수 없습니다",
                "helpText": "네트워크 연결을 확인하세요"
              },
              "footer": {
                "selectText": "선택",
                "navigateText": "탐색",
                "closeText": "닫기",
                "searchByText": "검색 기준"
              },
              "noResultsScreen": {
                "noResultsText": "결과를 찾을 수 없습니다",
                "suggestedQueryText": "새로운 검색을 시도할 수 있습니다",
                "reportMissingResultsText": "해당 검색어에 대한 결과가 있어야 합니까?",
                "reportMissingResultsLinkText": "피드백 보내기 클릭"
              }
            }
          }
        }
      }
    }
  },
  "nav": [
    {
      "text": "Guide",
      "link": "/guide/what-is-vitepress",
      "activeMatch": "/guide/"
    },
    {
      "text": "Reference",
      "link": "/reference/site-config",
      "activeMatch": "/reference/"
    },
    {
      "text": "1.0.0",
      "items": [
        {
          "text": "Changelog",
          "link": "https://github.com/nuecms/nueui/blob/main/CHANGELOG.md"
        },
        {
          "text": "Contributing",
          "link": "https://github.com/nuecms/nueui/blob/main/.github/contributing.md"
        }
      ]
    }
  ],
  "sidebar": {
    "/guide/": {
      "base": "/guide/",
      "items": [
        {
          "text": "Introduction",
          "collapsed": false,
          "items": [
            {
              "text": "What is VitePress?",
              "link": "what-is-vitepress"
            },
            {
              "text": "Getting Started",
              "link": "getting-started"
            },
            {
              "text": "Routing",
              "link": "routing"
            },
            {
              "text": "Deploy",
              "link": "deploy"
            }
          ]
        },
        {
          "text": "Writing",
          "collapsed": false,
          "items": [
            {
              "text": "Markdown Extensions",
              "link": "markdown"
            },
            {
              "text": "Asset Handling",
              "link": "asset-handling"
            },
            {
              "text": "Frontmatter",
              "link": "frontmatter"
            },
            {
              "text": "Using Vue in Markdown",
              "link": "using-vue"
            },
            {
              "text": "Internationalization",
              "link": "i18n"
            }
          ]
        },
        {
          "text": "Customization",
          "collapsed": false,
          "items": [
            {
              "text": "Using a Custom Theme",
              "link": "custom-theme"
            },
            {
              "text": "Extending the Default Theme",
              "link": "extending-default-theme"
            },
            {
              "text": "Build-Time Data Loading",
              "link": "data-loading"
            },
            {
              "text": "SSR Compatibility",
              "link": "ssr-compat"
            },
            {
              "text": "Connecting to a CMS",
              "link": "cms"
            }
          ]
        },
        {
          "text": "Experimental",
          "collapsed": false,
          "items": [
            {
              "text": "MPA Mode",
              "link": "mpa-mode"
            },
            {
              "text": "Sitemap Generation",
              "link": "sitemap-generation"
            }
          ]
        },
        {
          "text": "Config & API Reference",
          "base": "/reference/",
          "link": "site-config"
        }
      ]
    },
    "/reference/": {
      "base": "/reference/",
      "items": [
        {
          "text": "Reference",
          "items": [
            {
              "text": "Site Config",
              "link": "site-config"
            },
            {
              "text": "Frontmatter Config",
              "link": "frontmatter-config"
            },
            {
              "text": "Runtime API",
              "link": "runtime-api"
            },
            {
              "text": "CLI",
              "link": "cli"
            },
            {
              "text": "Default Theme",
              "base": "/reference/default-theme-",
              "items": [
                {
                  "text": "Overview",
                  "link": "config"
                },
                {
                  "text": "Nav",
                  "link": "nav"
                },
                {
                  "text": "Sidebar",
                  "link": "sidebar"
                },
                {
                  "text": "Home Page",
                  "link": "home-page"
                },
                {
                  "text": "Footer",
                  "link": "footer"
                },
                {
                  "text": "Layout",
                  "link": "layout"
                },
                {
                  "text": "Badge",
                  "link": "badge"
                },
                {
                  "text": "Team Page",
                  "link": "team-page"
                },
                {
                  "text": "Prev / Next Links",
                  "link": "prev-next-links"
                },
                {
                  "text": "Edit Link",
                  "link": "edit-link"
                },
                {
                  "text": "Last Updated Timestamp",
                  "link": "last-updated"
                },
                {
                  "text": "Search",
                  "link": "search"
                },
                {
                  "text": "Carbon Ads",
                  "link": "carbon-ads"
                }
              ]
            }
          ]
        }
      ]
    }
  },
  "editLink": {
    "pattern": "https://github.com/nuecms/nueui/edit/main/docs/:path",
    "text": "Edit this page on GitHub"
  },
  "footer": {
    "message": "Released under the MIT License.",
    "copyright": "Copyright © 2019-present Terry Cai"
  }
}

Page Data

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

Page Frontmatter

{
  "outline": "deep"
}

More

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

Released under the MIT License.