<Head> Component

Import <Head> from @unhead/vue/components, then place native lowercase elements such as <title>, <meta>, and <link> inside it.

When to Use <Head>

<Head> provides HTML-like template syntax. Use useHead() instead when you need typed object input or entry options.

Usage

Place the native elements you would normally put in <head> inside the component:

<script lang="ts" setup>
import { Head } from '@unhead/vue/components'
</script>

<template>
  <Head>
    <title>Example Site</title>
    <meta name="description" content="An example page description.">
  </Head>
</template>

Unmounting <Head> removes its entry.