---
url: 'https://vue-to-print.siaikin.website/guide/basic-usage.md'
---

# Basic Usage

## Print using hook (recommended)

::: details Click to view code

::: code-group
<<< @/examples/PrintByHook.vue{vue}
<<< @/examples/ComponentToPrint.vue{vue} \[printed component]
:::

## Print using a component

::: details Click to view code

::: code-group
<<< @/examples/PrintByComponent.vue{vue}
<<< @/examples/ComponentToPrint.vue{vue} \[printed component]
:::

## Print [Web Components](https://developer.mozilla.org/en-US/docs/Web/API/Web_components)

This example will print `Web Components` components from [Ionic](https://ionicframework.com/).

::: details Click to view code

::: code-group
<<< @/examples/shadow-dom/PrintShadowDomByHook.vue{vue}
<<< @/examples/shadow-dom/ShadowDomToPrint.vue{vue} \[printed component]
:::