angular 项目中添加 font图标库

去年公司后台页面全部转向angular ，初期的时候公司没有自己的图标库，就想着加一个图标库进去。本来rn项目里使用的是react-native-vector-icons 这种资源比较全的库，想想项目刚启动引入一个图标库就够用了，然后查找资料添加了font-awesome的库。

1. 添加字体图标库到项目依赖

npm install font-awesome --save

 

2.如何在项目component中使用

在angular-cli.json 文件中styles[] array中添加font-awesome引用路径

"apps": [
          {
             "root": "src",
             "outDir": "dist",
             ....
             "styles": [
                "styles.css",
                "../node_modules/bootstrap/dist/css/bootstrap.css",
                "../node_modules/font-awesome/css/font-awesome.css" // -here webpack will automatically build a link css element out of this!?
             ],
             ...
         }
       ]

],

* in your styles.css

@import '~font-awesome/css/font-awesome.css';

* in your styles.scss

$fa-font-path: "~font-awesome/fonts";

 @import '~font-awesome/scss/font-awesome';