为什么使用 Nuxt v3 静态生成时 <font-awesome-icon /> 会输出两次后面的内容？

Question

我将vue-fontawesome与 Nuxt 3 一起使用，如此处所述，我看到了这种奇怪的行为。说我有这样的东西

<a href="https://example.com"><font-awesome-icon icon="fa-brands fa-twitter" />Example</a>

如果我运行开发服务器，一切都很好，但如果我generate通过静态 HTTP 服务器运行并提供输出，我会打印两次“示例”。如果我将文本包装在标签中，我会得到标签和文本两次（即<span>Example</span><span>Example</span>）。但奇怪的是，生成的 HTML 不包含重复内容，所以我怀疑浏览器中发生了一些奇怪的事情。

您可以从此处获取生成的站点作为可重现的测试用例。https://andreafranceschini.org/files/afnuxt.tgz

我听说vue-fontawesome对 SSR 和静态生成不太满意，但我也看到其他人以同样的方式使用它，所以我想知道我可能做错了什么？

编辑我也将其作为“错误”发布在这里。

编辑2解决方法是将图标单独包含在其他东西中，例如标签span。

Answer 1

我找到了一个解决方法，即将图标单独包含在其他东西中，例如标签span。