Nuxt.js@4 中管理 HTML ＜head＞ 标签

可以在 nuxt.config.ts 中配置全局的 HTML 标签，也可以在指定 index.vue 页面中配置指定的 HTML 标签。

在 nuxt.config.ts 中配置 HTML 标签

export default defineNuxtConfig({compatibilityDate: '2025-07-15',devtools: { enabled: true },app: {head: {charset: 'utf-8',viewport: 'width=device-width, initial-scale=1.0',title: 'nuxtjsFrameTest',meta: [{ name: 'description', content: 'nuxtjsFrame' },],},},
})

在指定 index.vue 中配置 HTML 标签

<script setup>const route = useRoute();useHead({title: '首页',meta: [{ name: 'description', content: '首页' }]
})useSeoMeta({
title: () => `User ${route.params.id}`,
description: () => `用户 ${route.params.id} 页面`,
keywords: '首页'
})</script>

在 Nuxt 3/4 中，要设置页面的标题和 SEO 元信息，需要用 useHead 或 useSeoMeta（推荐）在页面组件里声明；