Изучите Nuxt с коллекцией из 100+ советов!
Композабл useSeoMeta позволяет вам определять мета-теги для SEO вашего сайта в виде плоского объекта с полной поддержкой TypeScript.

Это помогает вам избежать распространенных ошибок, таких как использование name вместо property, а также опечаток - более 100+ полностью типизированных метатегов.

Это рекомендуемый способ добавления мета-тегов на ваш сайт, поскольку он безопасен с точки зрения XSS и имеет полную поддержку TypeScript.
Узнать больше Docs > Getting Started > Seo Meta.

Использование

app.vue
<script setup lang="ts">
useSeoMeta({
  title: 'Мой удивительный сайт',
  ogTitle: 'Мой удивительный сайт',
  description: 'Это мой удивительный сайт, позвольте мне рассказать вам о нем',
  ogDescription: 'Это мой удивительный сайт, позвольте мне рассказать вам о нем',
  ogImage: 'https://example.com/image.png',
  twitterCard: 'summary_large_image',
})
</script>

При вставке реактивных тегов вы должны использовать синтаксис вычисляемого геттера (() => value):

app.vue
<script setup lang="ts">
const title = ref('My title')

useSeoMeta({
  title,
  description: () => `description: ${title.value}`
})
</script>

Параметры

Существует более 100 параметров. См. полный список параметров в исходном коде.

Узнать больше Docs > Getting Started > Seo Meta.