IonicでGoogle Fontを使う方法

Google Fontをダウンロード

今回は「Noto Sans Japanese」を例にしていきます。
普通にGoogle Fontのデータをダウンロード

おそらく6種類のファイルがダウンロードできたかと思いますが、今回はNotoSansJP-Regular.otfしか使いません

プロジェクト内に設置

👇のようにIonicのプロジェクト内の設置します。
projectFolder/src/assets/fonts/Noto_Sans_JP/NotoSansJP-Regular.otf

Importして使う

global.scssに👇のようなcssを追加

global.scss

@font-face {
  font-family: 'NotoSansJP';
  src: url('assets/fonts/Noto_Sans_JP/NotoSansJP-Regular.otf');
}

ion-content {
  font-family: 'NotoSansJP';
}

参考