fortawesome在vue3中的使用

原创

lenglingx 2023-12-25 23:21:06 博主文章分类：Vue ©著作权

文章标签 ico App Vue 文章分类 运维

©著作权归作者所有：来自51CTO博客作者lenglingx的原创作品，请联系作者获取转载授权，否则将追究法律责任

fortawesome的使用，2023-12-25

https://fontawesome.com/search?o=r&m=free&c=coding&s=solid

6.5.1,3.0.5,6.5.1

yarn add @fortawesome/fontawesome-svg-core 
yarn add @fortawesome/vue-fontawesome 
yarn add @fortawesome/free-solid-svg-icons

/* Set up using Vue 3 */
import { createApp } from 'vue'
import App from './App.vue'

/* import the fontawesome core */
import { library } from '@fortawesome/fontawesome-svg-core'

/* import font awesome icon component */
import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'

/* import specific icons */
import { faUserSecret } from '@fortawesome/free-solid-svg-icons'

/* add icons to the library */
library.add(faUserSecret)

createApp(App)
.component('font-awesome-icon', FontAwesomeIcon)
.mount('#app')

<template>
  <div id="app">

    <!-- Add the style and icon you want using the String format -->
    <font-awesome-icon icon="fa-solid fa-user-secret" />

  </div>
</template>

<script>
  export default {
    name: 'App'
  }
</script>