unhead

Install Unhead

Get started with Unhead by installing the dependency to your project.

Using Vue? Check out the Vue integration.

Using Nuxt? Unhead is already built-in! Check out the Nuxt docs.

Setup

  1. Install unhead dependency to your project:
yarn
yarn add unhead
  1. Create a head instance somewhere in your apps entry.
main.ts
import { createHead } from 'unhead'
// Create a global head instance
const head = createHead()
  1. Done! Now you can use the useHead composable to manage your head.
import { useHead } from 'unhead'
useHead({
  title: 'My awesome site'
})

Optional: Auto-Imports

Unhead provides out-of-the-box configuration for unplugin-auto-import.

vite.config.ts
import { unheadComposablesImports } from 'unhead'
export default defineConfig({
  plugins: [
    AutoImport({
      imports: [
        unheadComposablesImports[0],
      ],
    }),
  ]
})

Next Steps

Your app is now setup for head management, congrats! 🎉

Try next:

  1. Optional: Setup SSR
  2. Add some recipes