fontawesome JS API 如何只导入部分图标？

Question

我完全阅读了docs。

我安装了 NPM 依赖项，然后在我的 index.js:

import { library, icon } from '@fortawesome/fontawesome-svg-core'
import { faPlus } from '@fortawesome/free-solid-svg-icons'

library.add(faPlus)

在我的 HTML

<i class="fa-solid fa-plus"></i>

但是图标没有渲染。

我错过了什么？我正在使用 webpack 5.

Answer 1

我失踪了dom.watch()

without dom.watch(), automatic replacement of your Font Awesome icons won’t work in the rendered page!

import { dom, library, icon } from '@fortawesome/fontawesome-svg-core'
import { faPlus } from '@fortawesome/free-solid-svg-icons'

library.add(faPlus)
dom.watch()

他们没有在文档中提及。现在它可以正常工作，并且包的大小要小得多。

Answer 2

您需要在 use dom.watch()

之前导入 dom

import { dom } from '@fortawesome/fontawesome-svg-core'

fontawesome JS API 如何只导入部分图标？

How to import only some icons with fontawesome JS API?

font-awesome

webpack-5

font-awesome-5