如何在Laravel 6中使用Font Awesome 5图标 [英] How to use Font Awesome 5 icons in Laravel 6

问题描述

我已经在我的 package.json 中安装了Fontawesome.

I already installed Fontawesome in my package.json.

"devDependencies": {
    "@fortawesome/fontawesome-free": "^5.11.2" ,
    //etc.
},
"dependencies": { "font-awesome": "^4.7.0" }

并将其导入到我的 app.scss

@import "~font-awesome/scss/font-awesome.scss";

---

我尝试了<i class="fa fa-edit"></i>和<i class="fas fa-edit"></i>，但如下所示，有人知道如何正确执行此操作吗?

---

I tried <i class="fa fa-edit"></i> and <i class="fas fa-edit"></i> but it just shows like this below, someone knows how to do this correctly?

推荐答案

首先将所有fontawesome-icons导入您的app.scss

@import '~@fortawesome/fontawesome-free/scss/fontawesome';
@import '~@fortawesome/fontawesome-free/scss/regular';
@import '~@fortawesome/fontawesome-free/scss/solid';
@import '~@fortawesome/fontawesome-free/scss/brands';

第二个，最重要的是，您错过的是将Web字体复制到公用文件夹.在您的webpack.mis.js下方添加此内容.

Second, and most important that you missed is to copy the webfonts to your public folder. In you webpack.mis.js append this below.

.copy('node_modules/@fortawesome/fontawesome-free/webfonts', 'public/webfonts')

这篇关于如何在Laravel 6中使用Font Awesome 5图标的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！