Components | Unhead

The Unhead Vue package exports a <Head> component that can be used to manage your head tags.

While it's recommended to use the useHead composable as it offers a more flexible API with full TypeScript support, the <Head> component may make more sense for your project.

The component will takes any child elements that you would normally put in your actual <head> and renders them with Unhead.

<script lang="ts" setup>
import { Head } from '@unhead/vue/components'
</script>
<template>
  <Head>
    <title>My awesome site</title>
    <meta name="description" content="My awesome site description">
  </Head>
</template>