在处理可访问性时，您可能会遇到的一个常见问题是您的 HTML 标记没有 lang 属性。
lang 属性告诉用户页面是用哪种语言编写的。
有效语言属性的一些示例是：
<!-- French content --> <html lang= "fr" ></html>
注意：在此处查找所有语言代码。
我们还可以扩展用例来定义一种语言的特定版本，例如英国英语。
<html lang= "en-gb" ></html>
将此 lang 标记添加到 Next.js
在任何普通的纯 HTML 网站中，我们都会将此标签添加到 HTML 元素中。但是，对于 Next.js，我们无法直接访问它。
所以要添加这个标签，我们需要使用next.config.js文件。
module . exports = { i18n : { locales : [ ' en ' ], defaultLocale : ' en ' , }, };
如果您的网站支持多种语言，您甚至可以在locales数组中放置各种值。
然后使用默认语言环境设置当前语言环境。
您甚至可以使用此配置来设置自定义域，但我们可能会单独深入研究。
替代方法
如果要覆盖多个 HTML 属性，还有另一种添加自定义 HTML 标记的方法。
在您的pages目录中，您可以添加一个_document.js文件。
此页面将覆盖默认的 Next.js 文档。
在其中，添加以下结构，就可以开始了。
import { Html , Head , Main , NextScript } from ' next/document ' ; export default function Document () { return ( < Html lang = ' en ' > < Head /> < body > < Main /> < NextScript /> < /body > < /Html > ); }
就是这样，在 Next.js 中添加 lang 标记的两种不同方式。
我喜欢使用配置方式，因为它更干净且面向未来。
感谢您的阅读，让我们联系吧！
感谢您阅读我的博客。随时订阅我的电子邮件通讯并在Facebook或Twitter 上联系
原文： https://dev.to/dailydevtips1/nextjs-add-lang-attribute-to-html-tag-45kn