Open1

【Vuetify】アイコンが表示されないときの解決方法

enumuraenumura

◆問題の内容

vuetifyでv-iconv-app-bar-nav-iconを使用しアイコンを表示しようとしたが、
アイコンが表示されない。
colorで色を付けてみてもアイコンは以下の画像のように表示されない状態。

◆原因

@mdi/font をインストールしていなかった。

◆対処法

以下のコマンドで@mdi/font をインストールした。

npm install --save @mdi/font

次にmain.jsファイルに以下の@mdi/font をインポートする記述を追加。

import '@mdi/font/css/materialdesignicons.css'

◆結果

以下画像のようにアイコンが表示されました。

◆参考