字体5和角5
字体5和角5
提问于 2018-07-05 08:15:47
我使用的是字体-令人敬畏的npm软件包(这是FontAwese4.7版)，但我想升级到FontAwese5。我安装了以下软件包：
"@fortawesome/angular-fontawesome": "^0.1.1",
"@fortawesome/fontawesome": "^1.1.8",
"@fortawesome/fontawesome-free-brands": "^5.0.13",
"@fortawesome/fontawesome-free-regular": "^5.0.13",
"@fortawesome/fontawesome-free-solid": "^5.0.13",
"@fortawesome/fontawesome-svg-core": "^1.2.0",
"@fortawesome/free-solid-svg-icons": "^5.1.0",我用的是这样的图标：
<i class="fa fa-plus"></i>在新版本中，我尝试使用这样的图标：
<i class="fas fa-sign-out-alt fa-2x"></i>但这不管用。我试着添加这样的图标：
import {faSignOutAlt} from '@fortawesome/fontawesome-free-solid';
import fontawesome from '@fortawesome/fontawesome';
fontawesome.library.add(faSignOutAlt);在我的app.module.ts中，它正在工作，但我不想一个接一个地导入每个图标。有办法像我以前的版本那样使用它们吗？不是一个接一个的进口吗？
谢谢
回答 4
Stack Overflow用户
回答已采纳
发布于 2018-09-06 20:02:19
安装
npm install --save @fortawesome/fontawesome-free和使用在。角-cli。
"styles": [
"styles.css",
"../node_modules/@fortawesome/fontawesome-free/css/all.css",参考资料：使用包管理器
Stack Overflow用户
发布于 2018-07-05 09:11:46
是的，您可以导入并添加它们。
import { fas } from '@fortawesome/free-solid-svg-icons';
import { far } from '@fortawesome/free-regular-svg-icons';
export class AppModule {
constructor(library: FaIconLibrary) {
library.addIconPacks(fas, far);
}
}您还可以导入整个图标样式。但要小心！这种导入图标的方式不支持树抖动，因此从导入的包中的所有图标都将在包中结束。
此外，由于您使用的是angular-fontawesome，请使用它：
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { FontAwesomeModule, FaIconLibrary } from '@fortawesome/angular-fontawesome';
import { faCoffee } from '@fortawesome/free-solid-svg-icons';
import { AppComponent } from './app.component';
@NgModule({
declarations: [AppComponent],
imports: [BrowserModule, FontAwesomeModule],
bootstrap: [AppComponent]
})
export class AppModule {
constructor(library: FaIconLibrary) {
// Add an icon to the library for convenient access in other components
library.addIcons(faCoffee);
}
}在html中
<!-- simple name only that assumes the default prefix -->
<fa-icon icon="coffee"></fa-icon>
<!-- ['fas', 'coffee'] is an array that indicates the [prefix, iconName] -->
<fa-icon [icon]="['fas', 'coffee']"></fa-icon>Stack Overflow用户
发布于 2019-10-24 11:35:03
我正在使用这个在角8版本。它运转得很好。请遵循以下简单程序：
- 首先按角度安装 npm安装-保存@fortawesome/fontawesome免费
- 打开angular.json并按以下方式更新css文件 "styles"："styles.css"，styles.css
- 重新启动服务器
如何添加
<i class="fas fa-paper-plane"></i>快乐编码:)
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/51186379
复制相关文章
相似问题
腾讯云开发者
