我想在Vue 2.5项目（使用Laravel运行）中使用一些FontAwesome字体。根据手册，如果我不想使用CDN并使我的应用程序脱机运行，最好的方法是将其添加到我的app.js：
import { library } from '@fortawesome/fontawesome-svg-core'
import { faUserSecret } from '@fortawesome/free-solid-svg-icons'
import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
library.add(faUserSecret)
Vue.component('font-awesome-icon', FontAwesomeIcon)
然后，在我的Vue组件（.vue）中，我必须使用以下代码：
<font-awesome-icon icon="user-secret" />
因此，每次我想使用新图标时，都必须：
检查free按钮
搜索图标
进入细节
复制链接即 <i class="far fa-eye"></i>
转到我的app.js（或我的情况下，我的fontawesome.js）并添加：
import { faUserSecret, faEye } from '@fortawesome/free-solid-svg-icons'
library.add(faUserSecret)
library.add(faEye)
转到我的Vue组件，然后<font-awesome-icon icon="eye" />在我想添加的任何地方添加
这个过程是最佳且最少的吗？
是。我承认这是一个繁重的过程，但它对性能有好处。
图书馆自述文件中的所有内容均已说明：
为什么要使用图书馆的概念？
显式选择图标的优点是仅捆绑了您在最终捆绑文件中使用的图标。这使我们可以将Font Awesome的数千个图标子集化为通常使用的少量图标。
如果您不介意包含未使用图标的捆绑包，则可以按以下方式导入所有内容：
import { fab } from '@fortawesome/free-brands-svg-icons'
library.add(fab)
花时间阅读整个自述文件，我知道这很长，但是值得！
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句