Update global-component.md

Clarify descriptions of the `ClientOnly` and `OutboundLink` global vitepress components
pull/568/head
Joel Kuzmarski 4 years ago committed by GitHub
parent 0c31bbac85
commit 993b4e1fa1
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

@ -1,6 +1,6 @@
# Global Component # 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. VitePress comes with few built-in components that can be used globally. You may use these components in your markdown or your custom theme configuration.
## Content ## Content
@ -17,9 +17,9 @@ The `Content` component displays the rendered markdown contents. Useful [when cr
The `ClientOnly` component renderes its slot only at client side. 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. 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. If you are using or demoing components that are not SSR-friendly (for example, components that contain [custom directives](https://vuejs.org/guide/reusability/custom-directives.html) that don't implement an [SSR transform](https://github.com/vuejs/core/issues/3298#issuecomment-785607554)), you can wrap them inside the `ClientOnly` component.
```html ```html
<ClientOnly> <ClientOnly>
@ -29,4 +29,4 @@ If you are using or demoing components that are not SSR-friendly (for example, c
## OutboundLink ## OutboundLink
The indicator `OutboundLink` is used to denote external links. In VitePress, this component has been followed by every external link. The component `OutboundLink` is used to denote external links on the page. In VitePress, this component "follows" every external link. `OutboundLink` is a small component that simply renders an SVG icon after an external link.

Loading…
Cancel
Save