我使用的是Angular 2+和Angular CLI。
我如何添加字体awesome到我的项目?
我使用的是Angular 2+和Angular CLI。
我如何添加字体awesome到我的项目?
当前回答
以上工作说明很多,建议大家看一下。不过,有一点需要注意:
在安装后,使用<i class="fas fa-coffee"></i>在我的项目(新实践项目只有一个星期了)中没有工作,这里的示例图标也在过去一周内从Font Awesome复制到剪贴板。
这个<i class="fa fa-coffee"></i>是有效的。如果在你的项目上安装了Font Awesome后,它还不能工作,我建议检查图标上的类,删除's',看看它是否工作。
其他回答
经过一些实验,我设法得到以下工作:
使用npm安装: NPM install font-awesome——保存 添加到angular-cli-build.js文件: vendorNpmFiles: [ font-awesome / * * / *。+ (css | css.map |传递|测试结束svg | | ttf woff | | woff2)”, ] 添加到index.html <link rel="stylesheet" href="vendor/font-awesome/css/font-awesome.min.css">
关键是在angular-cli-build.js文件中包含字体文件类型
.+(css|css.map|otf|eot|svg|ttf|woff|woff2)
使用Angular2 RC5和angular-cli 1.0.0-beta.11-webpack。你可以通过CSS导入来实现这一点。
只需安装字体awesome:
npm install font-awesome --save
然后在你配置的样式文件中导入font-awesome:
@import '../node_modules/font-awesome/css/font-awesome.css';
(样式文件在angular-cli.json中配置)
对于使用ng的Angular 9:
ng add @fortawesome/angular-fontawesome@0.6.x
更多信息请看这里
现在有几种方法可以在Angular CLI上安装fontAwesome:
ng add @fortawesome/angular-fontawesome
OR using yarn
yarn add @fortawesome/fontawesome-svg-core
yarn add @fortawesome/free-solid-svg-icons
yarn add @fortawesome/angular-fontawesome
OR Using NPM
npm install @fortawesome/fontawesome-svg-core
npm install @fortawesome/free-solid-svg-icons
npm install @fortawesome/angular-fontawesome
参考资料:https://github.com/FortAwesome/angular-fontawesome
我想使用字体Awesome 5+和大多数答案集中在旧版本
对于新的Font Awesome 5+, angular项目还没有发布,所以如果你想使用Font Awesome网站atm上提到的例子,你需要使用一个变通方法。(尤其是fas, far类而不是fa类)
我刚刚在我的styles.css中导入了cdn到Font Awesome 5。只是添加了这个,以防它能帮助别人比我更快地找到答案:-)
样式代码。css
@import "https://use.fontawesome.com/releases/v5.0.7/css/all.css";