第十三章：SEO 和 Meta —— 节目导视、海报、标题条，不能播完再补

1 分钟 191 字第 140 / 962 个阅读单元

Nuxt 官方的 SEO 文档核心有两层：

nuxt.config.ts 里的 app.head
运行时的 useHead()

#1. 全台静态默认导视

// nuxt.config.ts
export default defineNuxtConfig({
  app: {
    head: {
      title: '软件城市电视台',
      htmlAttrs: {
        lang: 'zh-CN'
      },
      link: [
        { rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }
      ]
    }
  }
})

适合放：

默认站名
语言
favicon
全局稳定 meta

#2. 页面级动态导视

vue

<script setup lang="ts">
useHead({
  title: '今晚头条',
  meta: [
    { name: 'description', content: '今晚最重要的技术新闻速递' }
  ]
})
</script>

适合：

页面标题
页面描述
动态 SEO 信息

#3. 心智模型别错

text

app.head = 全台固定导视系统
useHead() = 当前节目自己的标题条和海报

如果你把所有动态 SEO 都硬塞进 nuxt.config.ts，会很快失控。