Как установить атрибут lang для HTML-элемента с Nuxt?

Question

Использование файла nuxt.config.js файл, head содержимое может быть настроено для добавления мета или других вещей:

module.exports = {
  /*
  ** Headers of the page
  */
  head: {
    title: 'awesome title',
    meta: [
      { charset: 'utf-8' },
      { name: 'viewport', content: 'width=device-width, initial-scale=1' },
      { hid: 'description', name: 'description', content: 'Nuxt.js project' }
    ],
    link: [
      { rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }
    ]
  },
  ...
}

Но я не могу найти ничего в документации, чтобы установить атрибуты на html элемент - я хочу установить lang приписывать. Есть способ сделать это?

Answer 1

Источник: Объявление языка в тэге HTML. Проблема № 388. Nuxt / nuxt.js

head поддерживает htmlAttrs имущество. Он отобразит каждый ключ: значение объекта как атрибут: значение

module.exports = {
  head: {
    htmlAttrs: {
      lang: 'en'
    },
    title: 'awesome title',
    meta: [
      { charset: 'utf-8' },
      { name: 'viewport', content: 'width=device-width, initial-scale=1' },
      { hid: 'description', name: 'description', content: 'Nuxt.js project' }
    ],
    link: [
      { rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }
    ]
  },
  ...
}

Answer 2

В Nuxt 3 введите компонент

      <script setup>
useHead({
  htmlAttrs: {
    lang: 'en',
    style: 'font-size: 13px'
  }
})
</script>

https://v3.nuxtjs.org/guide/features/head-management/

Answer 3

Добавьте htmlAttrs вnuxt.config.js

      export default defineNuxtConfig({
    app: {
        head: {
            htmlAttrs: {
                lang: 'en',
            },
            title: 'title',
            charset: 'utf-8',
            meta: [],
            link: [],
        }
    },
})