方特8角很棒，最好的进口方式是什么？ [英] FontAwesome in Angular 8, best way to import?

问题描述

我在我的角度8+应用程序中使用了Fontawese5.x，而导入图标的系统对我来说非常非常可怕。 我是这样做的：(就像文档上说的https://github.com/FortAwesome/angular-fontawesome)

import { Component, OnInit } from '@angular/core';
import {faHome,faSearch,faArchive,faFileSignature,
    faAddressBook,faUserMd,faDesktop} from '@fortawesome/free-solid-svg-icons/'

@Component({
selector: 'app-menu',
templateUrl: './menu.component.html',
styleUrls: ['./menu.component.css']
})
export class MenuComponent implements OnInit {
faHome = faHome;
faSearch = faSearch;
faArchive = faArchive;
faFileSignature = faFileSignature;
faAddressBook = faAddressBook;
faUserMd = faUserMd;
faDesktop = faDesktop;
constructor() { }

ngOnInit() {
}

}

如果你有<；10个图标，这是可以的，但如果你有+10，我认为这是非常糟糕的。有没有其他更好的方法来进口这个？ 我在angular.json的脚本中搜索了字体的css文件，将其导入到angular.json中，就像我对bootstrap popper.js和jQuery所做的那样，但在node_MODULES中没有找到它。

那么，有没有其他方法可以更干净地做到这一点呢？(非CDN方式)

[已解析]

好吧，我是在为桌面应用程序导入Fontawous库，不是为Web应用程序。 有了Web应用程序包，我可以做我自己做的事情。

谢谢大家。

推荐答案

如何在角度8+中导入字体漂亮的图标

1？步骤npm install --save-dev @fortawesome/fontawesome-free

angular.json中的步骤将路由粘贴到@fortawesy的css和js：

  "styles": [
          "src/styles.css",
          "node_modules/bootstrap/dist/css/bootstrap.min.css",
          "node_modules/@fortawesome/fontawesome-free/css/all.min.css" // this
        ],
        "scripts": [ 
          "node_modules/jquery/dist/jquery.min.js",
          "node_modules/popper.js/dist/umd/popper.min.js",
          "node_modules/bootstrap/dist/js/bootstrap.min.js",
          "node_modules/@fortawesome/fontawesome-free/js/all.min.js" //this
        ]

这就是我想要的。使用此选项，您只需将图标(例如：<i class="fas fa-home"></i>)粘贴到html中。

我想我发帖的另一种方式是针对桌面应用程序。

这篇关于方特8角很棒，最好的进口方式是什么？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！