web-dev-qa-db-fra.com

Comment ajoutez-vous Font Awesome à Ionic 4

Il y a beaucoup de tutoriels et d'articles sur la façon d'inclure Font Awesome dans un projet Ionic 3 mais j'ai eu du mal à en trouver sur la façon d'ajouter Font Awesome dans un Ionic = 4, ce qui pose la question: comment ajouter et utiliser Font Awesome dans un projet Ionic 4?

J'ai essayé d'utiliser ce qui suit tutoriel sans grand succès. J'ai essayé de suivre les étapes décrites dans ce qui suit réponse StackOverflow qui n'a pas fonctionné non plus.

ionic-frameworkfont-awesomeionic4
7
Tachyon

Exécutez la commande suivante:

npm install --save-dev @fortawesome/fontawesome-free

Puis dans angular.json ajoutez ceci sur "styles":

{
    "input": "node_modules/@fortawesome/fontawesome-free/css/all.css"
}
3
Pedro Cirilo

Au cas où quelqu'un traiterait avec FontAwesome PRO. J'ai récemment acheté des icônes pro FontAwesome et les ai intégrées comme ceci:

  • copiez le dossier FontAwesome webfonts dans src/assets /
  • copier le dossier scss FontAwesome dans src/theme /

  • changez le chemin $ fa-font-path dans _variables.scss avec assets/webfonts !default;

  • ajouter dans global.scss

    @import './theme/[YourDirectoryfontawesomeScss[/fontawesome.scss';
    @ import './theme/[YourDirectoryfontawesomeScss[/solid.scss';
    @ import './theme/[YourDirectoryfontawesomeScss[/brands.scss';
    @ import './theme/[YourDirectoryfontawesomeScss[/light.scss';
    @ import './theme/[YourDirectoryfontawesomeScss[/regular.scss';

Enfin, vous pouvez les utiliser avec la balise i. Par exemple

<i class="fas fa-stack-overflow"></i>

vous pouvez trouver plus de détails sur les fa-classes ici https://fontawesome.com/how-to-use/on-the-web/setup/getting-started

2
ppichier