Intégrer Font Awesome avec Angular

Intégrer Font Awesome avec Angular

  1. Objectifs

    • Bien utiliser Bootstrap4 pour styliser des applications créées à l’aide d’Angular 9.
  2. Présentation

    • Vous pouvez obtenir des icônes vectorielles et des logos sociaux sur votre site Web avec Font Awesome . Font awesome possède le jeu d’icônes et la boîte à outils les plus populaires
    • Les icônes sont une exigence de base de chaque projet. les icônes indiquent plus, vous n’avez pas besoin d’écrire d’étiquette pour cela.
    • Les icônes font également une belle mise en page de notre application. Si vous pensez utiliser des icônes dans votre application, vous préférerez toujours utiliser des icônes impressionnantes. font-awesome fournit de nombreuses icônes et vous pouvez l’utiliser très facilement.
    • Pour suivre cet article il faut Créer une application Angular



  3. Intégration de Font Awesome

      • Étape 1:
        • En utilisant cette méthode, vous devez coller le lien CDN suivant dans la balise <head> de index.html
        • <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
      • Étape 2:
        • Exécutez votre projet et vous verrez une sortie comme suit:
        • Intégrer Font Awesome avec Angular

    1. Méthode 2: Installer le package npm
      • Étape 1:
        • Allez à nouveau sur votre terminal et arrêtez le dernier travail qui était "ng serve " en utilisant Ctrl + C et appuyez sur "O " pour y mettre fin,
        • Installer font-awesome avec la commande suivante: npm install font-awesome –save
      • Étape 2:
        • Recherchez le fichier style.ccs dans le fichier de votre application.
        • Intégrer Font Awesome avec Angular

      • Ouvrez ce fichier et importez vos packages bootstrap et font-awesome pour des utilisations au niveau de l’application, comme ceci.
      • @import  "~ bootstrap / dist / css / bootstrap.css" ; 
        @import  "~ font-awesome / css / font-awesome.css" ;