Vueでfontawesomeを使用する
vueでfontawesomeを使用するには、以下のライブラリをダウンロードします。
npm install --save @fortawesome/vue-fontawesome npm install --save @fortawesome/fontawesome-svg-core npm install --save @fortawesome/free-solid-svg-icons
インストールが完了したら、
main.jsファイルを以下のように修正します。// src/main.js import { createApp } from 'vue' import App from './App.vue' import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome' import { library } from '@fortawesome/fontawesome-svg-core' import { fas } from '@fortawesome/free-solid-svg-icons' library.add(fas) import './assets/main.css' createApp(App).component('FaIcon', FontAwesomeIcon).mount('#app')
上記のように作成したら、下のようにfontawesomeのアイコンを使用することができます。
<FaIcon icon="trash" />
farも使いたい場合
npm install --save @fortawesome/free-regular-svg-icons
regularをインストールしてクラス名を下のように書く
<FaIcon icon="fa-regular fa-check" />
