Nuxt Nation 大会即将到来。加入我们,时间为 11 月 12 日至 13 日。

useSeoMeta

useSeoMeta 可组合函数允许您将网站的 SEO 元标签定义为一个扁平对象,并提供完整的 TypeScript 支持。

这有助于避免常见错误,例如使用 name 而不是 property,以及拼写错误 - 并且超过 100 多个元标签都具有完整的类型定义。

这是向您的网站添加元标签的推荐方法,因为它安全且具有完整的 TypeScript 支持。
文档 > 入门 > SEO 元标签 中了解更多信息。

用法

app.vue
<script setup lang="ts">
useSeoMeta({
  title: 'My Amazing Site',
  ogTitle: 'My Amazing Site',
  description: 'This is my amazing site, let me tell you all about it.',
  ogDescription: 'This is my amazing site, let me tell you all about it.',
  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 个参数。请参阅 源代码中的完整参数列表

文档 > 入门 > SEO 元标签 中了解更多信息。