英文:
Next.js Head ignores duplicate Meta Tags
问题
只有这些不同媒体目标的 Meta 标签会在我的 Next.js 项目的头部中呈现：
<Head>
<meta name="theme-color" media="(prefers-color-scheme: light)" content="#7f8fa6"/>
<meta name="theme-color" media="(prefers-color-scheme: dark)" content="#141414" />
</Head>
不幸的是，只有这些 meta 标签中的最后一个会在页面上呈现，即用于暗模式的那个。
我知道我可以使用 JavaScript，但似乎应该有其他解决方法。是否有其他方法？
英文:
I'm using these Meta Tags with different media-targets in the Head of my Next.js project:
<Head>
<meta name="theme-color" media="(prefers-color-scheme: light)" content="#7f8fa6"/>
<meta name="theme-color" media="(prefers-color-scheme: dark)" content="#141414" />
</Head>
Unfortunately, only the last of these meta tags is then rendered on the page, which is in this case the one for the dark-mode.
I'm aware I could use Javascript, but this seems like there should be another way around. Is there?
答案1
得分: 0
你确定吗？在沙箱中运行正常。这里有2个标签。也许需要添加更多的代码示例，问题可能在别的地方。如果你按照文档操作，应该添加 key 属性。你可以参考 https://nextjs.org/docs/api-reference/next/head。
英文:
Are you sure? In sandbox works fine https://codesandbox.io/p/sandbox/busy-blackwell-0j4syp?file=%2Fpages%2F_document.tsx&selection=%5B%7B%22endColumn%22%3A13%2C%22endLineNumber%22%3A18%2C%22startColumn%22%3A13%2C%22startLineNumber%22%3A18%7D%5D.
There 2 tags.
Maybe need to add more code examples, maybe problems is somewhere else.
And if you follow the documentation, you should to add key property.
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论