FontAwesomeの適用時に font が反映されない

FontAwesomeのアイコンが表示されない問題の原因と解決方法。

FontAwesome CSS

FontAwesomeの適用時に font が反映されてなかった(2021/04/27)

事象:FontAwesomeの適用時に font が反映されてなかった 原因:font-family!importantしていて上書きされなかった。

  1. FontAwesomeでアカウント作成
  2. CDNを発行して部分に追加
  3. <i></i>等を適切な場所に追加
  4. 下記のようにfontawesomeが反映されていない。 image.png
  5. devtoolで確認すると、なぜか font familyが上書きされている image.png
  6. scssファイルを確認してみるとなぜか!importが指定されいたのでfont awesomeのfontで上書きされていなかったっぽい。過去の自分を殴りたい
:not(pre):not(code) {
    font-family: "Noto Sans JP" !important;
}
  1. 修正完了 image.png