// all your favourites, fully typed
useHead({
  title: 'Hello World',
  titleTemplate: (title) => `${title} | MySite`,
  // class API support
  bodyAttrs: { class: { overflow: () => isModalOpen } },
  meta: [
    { name: 'description', content: 'Hello World' },
  ],
  script: [ { src: 'https://example.com/script.js' } ],
  link: [{
    rel: 'stylesheet',
    href: 'https://example.com/style.css'
  }],
})

// server only head tags for improved performance
useServerHead({
  link: [
    {
      // promises supported
      href: import('~/assets/MyFont.css?url'),
      rel: 'stylesheet',
      type: 'text/css'
    }
  ]
})

// the easiest meta tags 
useSeoMeta({
  charset: 'utf-8',
  description: 'Welcome to my site',
  ogImage: 'https://example.com/image.jpg',
  ogLocale: 'en',
  ogLocaleAlternate: ['fr', 'zh'],
})

// DOM events right in your head
useHead({
  script: [
    {
      // async prop support
      src: './script.js',
      // dom handlers
      onload: () => alert('woo'),
    },
  ],
  htmlAttrs: { onclick: () => alert('just works') },
})