升级字体令人振奋的4.7至5.11.1 Angular 6项目

Question

在我的Angular 6应用程序中，其中，partch.json中的父级模块使用font-font-awesswess 4.7；

"font-awesome": "^4.7.0",

Angular.json;

"styles": ["projects/adminUI/src/styles.css",
          "./node_modules/font-awesome/css/font-awesome.min.css"],

现在，新开发的我的子模块需要具有5.11.1版本的字体可感知图标，如果我将其升级到新版本，是否会对父级应用程序中的现有图标产生任何影响？ 谁能建议如果有人以前做过，任何指针都将不胜感激吗？

Answer 1

注意：这是使用FA 6.1.1而不是5.11.1。

这取决于您如何展示Fontawesome图标。

如果您使用Fontawesess Angular包装器，那么您将不需要Angular.json中的任何内容。

下面的所有代码都是从Fontawesome的文档中收集的。

例子：
在包装中。

"@fortawesome/angular-fontawesome": "^0.10.2",
"@fortawesome/fontawesome-pro": "^6.1.1",
"@fortawesome/fontawesome-svg-core": "^6.1.1",
"@fortawesome/free-solid-svg-icons": "^6.1.1",

在app.module.ts中：

   import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';

   imports: [
...
    FontAwesomeModule,
...
]

在component.ts：

键点 - 导入您将在组件中使用的字体！

import {
  faPlus, faXmark, faArrowDown, faArrowUp,
  faArrowLeft, faArrowRight, faCamera, faUserPen,
  faTrashCan, faArrowsUpDown, faAlignRight, faBarsStaggered
} from '@fortawesome/free-solid-svg-icons';


  faPlus = faPlus;
  faXmark = faXmark;
  faArrowDown = faArrowDown;
  faArrowUp = faArrowUp;
  faArrowLeft = faArrowLeft;
  faArrowRight = faArrowRight;
  faCamera = faCamera;
  faUserPen = faUserPen;
  faTrashCan = faTrashCan;
  faArrowsUpDown = faArrowsUpDown;
  faAlignRight = faAlignRight;
  faBarsStaggered = faBarsStaggered;

在component.html中：

 <fa-icon [icon]="faBarsStaggered" size="lg" [fixedWidth]="true"></fa-icon>