Storybook (Vue) で Vuetify を使う際にアイコン（<v-icon>）が表示されない件

現象

アイコンが表示されてほしいが、文字列だけになってしまう。

対策

フォントへの参照が無いのが原因の場合

.storybook/preview-head.html に以下を追加

.storybook/preview-head.html

<link
  href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900|Material+Icons"
  rel="stylesheet"
/>

IEの場合

@font-face で不明のエラーが出るようです。

WebFontに対応してなさげなので、別途対応が必要です。

IEでWebフォントを表示させる | demodemo - Webデザイン/アプリ開発/フロトエンド開発のスキルデモ

IE11 not showing font awesome icons · Issue #8825 · FortAwesome/Font-Awesome

結果

無事、アイコンが表示されました。

リンク

Icon Component — Vuetify.js