mirror of https://github.com/vuejs/vitepress
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
33 lines
1.1 KiB
33 lines
1.1 KiB
# Global Component
|
|
|
|
VitePress comes with few built-in component that can be used globally. You may use these components in your markdown or your custom theme configuration.
|
|
|
|
## Content
|
|
|
|
The `Content` component displays the rendered markdown contents. Useful [when creating your own theme](./theming).
|
|
|
|
```vue
|
|
<template>
|
|
<h1>Custom Layout!</h1>
|
|
<Content />
|
|
</template>
|
|
```
|
|
|
|
## ClientOnly
|
|
|
|
The `ClientOnly` component renderes its slot only at client side.
|
|
|
|
Because VitePress applications are server-rendered in Node.js when generating static builds, any Vue usage must conform to the universal code requirements. In short, make sure to only access Browser / DOM APIs in beforeMount or mounted hooks.
|
|
|
|
If you are using or demoing components that are not SSR-friendly (for example, contain custom directives), you can wrap them inside the `ClientOnly` component.
|
|
|
|
```html
|
|
<ClientOnly>
|
|
<NonSSRFriendlyComponent />
|
|
</ClientOnly>
|
|
```
|
|
|
|
## OutboundLink
|
|
|
|
The indicator `OutboundLink` is used to denote external links. In VitePress, this component has been followed by every external link.
|