🚀
Astro で FONTPLUS の Web フォントを読み込む
先に結論
スクリプトの読み込み部分に is:inline を入れるだけで OK。検証していないけれど TypeSquare 等の Web フォントも同様のやり方で読み込めると思う。
src/layouts/layout.astro
<head>
<script
is:inline
src="https://webfont.fontplus.jp/accessor/script/fontplus.js?..."
></script>
</head>
なぜなのか
Astro では Web フォントに限らず、外部スクリプトの読み込み時は is:inline をつける必要がある。そうしないと Astro でスクリプトの処理・最適化・バンドルが走ってしまい、期待通りの挙動にはならない模様。
外部スクリプトをロードする – Astro Docs
ちなみに
Google Fonts に関しては、npm を用いたインストール方法が存在する。
Fontsourceを使う – Astro Docs
Discussion