[vue.js] font awesome 아이콘 넣기

yarn add @fortawesome/fontawesome-svg-core


Free icons styles                           
yarn add @fortawesome/free-solid-svg-icons
yarn add @fortawesome/free-regular-svg-icons
yarn add @fortawesome/free-brands-svg-icons

yarn add @fortawesome/vue-fontawesome@latest-3

import { createApp } from 'vue';
import { createPinia } from 'pinia';
import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome';
import {
  faUserSecret,
  faCoins,
  faPenToSquare,
  faUser,
  faGear,
  faRightFromBracket,
  faSortDown,
  faVolumeUp,
  faVolumeHigh,
  faMagnifyingGlass,
  faStore,
  faMapLocation,
  faFileSignature,
  faShirt,
  faUtensils,
  faPlus,
  faHome,
  faTrashAlt,
  faArrowUpRightFromSquare,
  faCheck,
  faHouse,
} from '@fortawesome/free-solid-svg-icons';
import { library } from '@fortawesome/fontawesome-svg-core';
import router from './router';
import socket from './plugins/socket';
import App from './App.vue';
import i18n from '@i18n';

// eslint-disable-next-line max-len
library.add(faHouse, faCoins, faPenToSquare, faUser, faGear, faRightFromBracket, faSortDown, faVolumeHigh, faMagnifyingGlass, faUtensils, faStore, faShirt, faMapLocation, faFileSignature, faPlus, faHome, faTrashAlt, faArrowUpRightFromSquare, faCheck);

createApp(App)
  .component('font-awesome-icon', FontAwesomeIcon)
  .use(createPinia())
  .use(socket, { url: 'http://localhost:3000' })
  .use(router)
  .use(i18n)
  .mount('#app');

  <div>
    <font-awesome-icon
      class="menu_icon"
      icon="fa-solid fa-house"
    />둘라밤 관리
  </div>​