How do I add font-awsome to Ionic 4 project?

2019-07-29 04:28发布

问题:

Does anyone knows the way of adding font-awsome to new Ionic 4 project (currently I'm using 4.0.0-beta.15).

Adding it to v3 is nicely explained here:

https://charlouze.github.io/ionic/2017/05/31/Ionic-3-and-Font-Awesome.html

and it works great for Ionic V3, but unfortunatelly not V4.

回答1:

install font-awesome

npm install font-awesome --save --save-exact

copy.config.js

copyFonts: {
  src: [
    '{{ROOT}}/node_modules/ionicons/dist/fonts/**/*',
    '{{ROOT}}/node_modules/ionic-angular/fonts/**/*', 
    '{{ROOT}}/node_modules/font-awesome/fonts/**/*'],
    dest: '{{WWW}}/assets/fonts'
  },

sass.config.js

includePaths: [
    'node_modules/ionic-angular/themes',
    'node_modules/ionicons/dist/scss',
    'node_modules/ionic-angular/fonts',
    'node_modules/font-awesome/scss'
  ],

variable.scss

$fa-font-path: $font-path;
@import "font-awesome";

home.html

<i class="fa fa-users"></i>

Please follow the above steps. That is working for me.