Symfony 5 不能使用 Font Awesome 图标

Question

我正在尝试使用 Webpack Encore 项目将 Font Awesome 导入我的 Symfony 5，但我不能。我已经阅读了所有（其中大部分）SO 问题、框架教程等，但没有显示任何图标。我遵循的步骤：第一次尝试：编译资产并观察变化yarn watch免费安装 Font Awesome：yarn add --dev @fortawesome/fontawesome-free将 CSS 文件导入app.css文件 ( assets/css/app.css)：@import '~@fortawesome/fontawesome-free/css/fontawesome.css';@import '~@fortawesome/fontawesome-free/css/regular.css';@import '~@fortawesome/fontawesome-free/css/solid.css';@import '~@fortawesome/fontawesome-free/css/brands.css';将图标添加到 TWIG 模板：（根据Font Awesome 文档<i class="fas fa-star"></i>，我还尝试在图标前加上。fa fa-star第二次尝试：编译资产并观察变化yarn watch免费安装 Font Awesome：yarn add --dev @fortawesome/fontawesome-free将 CSS / JS 文件导入app.js文件 ( assets/js/app.js):import '~@fortawesome/fontawesome-free/css/all.min.css'; import '~@fortawesome/fontawesome-free/js/all.js';将 Solid Font Awesome 图标导入 CSS 文件 ( assets/css/app.css)（以及 JS 文件）：@import '~@fortawesome/fontawesome-free/css/solid.css';将图标添加到 TWIG 模板：<i class="fas fa-star"></i>我也尝试过使用 CSS unicode：element {     content: "\f005"      }它们都不显示任何图标，或任何控制台错误、警告、消息或任何内容，但我每次都得到一个空图标。有什么线索吗？

Answer 1

您的第一次尝试是正确的方法，您只是错过了$fa-font-path正确的设置。

$fa-font-path: '~@fortawesome/fontawesome-free/webfonts';

@import '~@fortawesome/fontawesome-free/scss/fontawesome';

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

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

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