> [!warning] > [[xicons]] (`@vicons`) はインストールされるファイル数が非常に多いため、[[IDE]]の補完が著しく遅くなるリスクがある。`@vicons`は部分的なインストールができないため、[[xicons]]から[[SVG]]を個別に取得する方法を強く推奨。 > > 詳しくは > > [[📝Vue3にてxicons(vicons)を使うとNeovimの補完表示が著しく遅くなる]] アイコンの型定義をインストールして取り込むだけ。型定義と使えるアイコン一覧は[[xicons]]を参考にする。 ![[Pasted image 20220323104146.png]] 緑枠の名前が使えるタイプ。以下のように`@vicons/...`をインストールする。 ``` npm i -D @vicons/ionicons5 ``` 使うときはアイコン名でインポートする。 ```ts import { Earth } from "@vicons/ionicons5"; ``` `template`配下には`<n-icon>`でwrapする。 ```html <n-icon><Earth /></n-icon> ``` 動的にコンポーネント名を指定する方法もある。