在角-cli 8中为角7设置字体超赞5。
在角-cli 8中为角7设置字体超赞5。
提问于 2019-06-18 06:32:06
我想添加方阵5到我的角-cli 8.0.2项目(与scss)通过复制字体到项目(不是从互联网链接他们)，不使用任何外部插件/项目，但以直接的方式。
因此，我创建了项目并安装了fontawesome (免费) 通过国家预防机制，如下所示
ng n --style=scss --routing=true myproject
cd myproject
npm install --save-dev @fortawesome/fontawesome-free我修改文件：
- 在
angular.json中的键projects.myproject.architect.build.options.styles中，我向数组中添加了以下值"./node_modules/@fortawesome/fontawesome-free/scss/fontawesome.scss" - 在
styles.scss中，我添加了一行：@import "../node_modules/@fortawesome/fontawesome-free/scss/fontawesome.scss"; - 在
src/app/app.component.html中，在Wellcome文本之后添加<i class="fas fa-sync-alt"></i>
然后运行命令ng serve并进入浏览器到http://localhost:4200/并看到以下内容：
我使用不同的指示从互联网，但这是最好的结果，我得到-但仍然不工作(我们看到正方形，而不是这个图标)。如何解决这个问题？
回答 2
Stack Overflow用户
回答已采纳
发布于 2019-06-18 07:12:45
编辑:图标不显示的原因是您没有指定图标样式的类型。您可以找到一个受支持的图标样式列表这里 (或列在下面)：
brands.scsssolid.scssregular.scsslight.scss
原始答案
FontAwesome在其NPM包中包含的SCSS文件没有为您设置好自己:您应该自己导入各个SCSS文件。(更多信息请参见SCSS部分的文档 )
相反，您应该包含已经编译的CSS，这样您就不必手动导入SCSS文件。(运行下面的命令来设置样式)
ng config projects.myproject.architect.build.options.styles "./node_modules/@fortawesome/fontawesome-free/css/all.css"(或者手动将"./node_modules/@fortawesome/fontawesome-free/css/all.css"添加到项目样式中)
有关FontAwesome包中包含的内容的更多信息，请参阅文档。
Stack Overflow用户
发布于 2019-12-01 12:43:34
字体现在提供了字体角元件，但是您也可以使用以下简单的方法：
npm install --save @fortawesome/fontawesome-free只需简单地将以下内容添加到styles.scss中，就可以加载字体漂亮的图标
$fa-font-path: '~@fortawesome/fontawesome-free/webfonts';
@import "~@fortawesome/fontawesome-free/scss/fontawesome.scss";
@import "~@fortawesome/fontawesome-free/scss/solid.scss";
@import "~@fortawesome/fontawesome-free/scss/brands.scss";在角v8.2.14和角CLI v8.3.19上测试。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/56642947
复制相关文章
相似问题
腾讯云开发者
