Vuetify導入
yarn add vuetify @fortawesome/fontawesome-free
app/javascript/packs/plugins/vuetify.js
import Vue from 'vue' import Vuetify from 'vuetify' import "vuetify/dist/vuetify.min.css" import '@fortawesome/fontawesome-free/css/all.css' Vue.use(Vuetify) export default new Vuetify({ icons: { iconfont: 'fa', } })
app/javascript/packs/main.js
import vuetify from './plugins/vuetify' document.addEventListener('DOMContentLoaded', () => { const app = new Vue({ vuetify, render: h => h(App) }).$mount() document.body.appendChild(app.$el) })
使用例
<v-icon>fas fa-home</v-icon>
FontAwesome導入
yarn add @fortawesome/fontawesome-svg-core @fortawesome/vue-fontawesome
app/javascript/packs/main.js
import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome' Vue.config.productionTip = false Vue.component('FontAwesomeIcon', FontAwesomeIcon)
使用例
<FontAwesomeIcon icon="user"/> <FontAwesomeIcon :icon="['far', 'star']"/> <FontAwesomeIcon :icon="['fab', 'facebook']"/>