vue3+fontawesome

vue-fontawesome

install

$ npm i --save @fortawesome/fontawesome-svg-core
$ npm i --save @fortawesome/free-solid-svg-icons
$ npm i --save @fortawesome/vue-fontawesome@prerelease

main.ts

import { createApp } from 'vue'
import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
import App from './App.vue'
const app = createApp(App);
app.component('font-awesome-icon', FontAwesomeIcon);
app.mount('#app');

component.vue

<template>
<div class="noticeMsg" @click="info" title="查看新消息">
     <div :class="{ newMsg: hasNewMsg }"></div>
     <font-awesome-icon :icon="['fas', 'envelope']" />
</div>
</template>

<script lang="ts">
import { defineComponent } from "vue";
import { library } from "@fortawesome/fontawesome-svg-core";
import {
  faAlignJustify,
  faEnvelope,
  faUser,
  faAngleDown,
  faWindowClose,
  faRedo,
} from "@fortawesome/free-solid-svg-icons";
library.add(
  ...[faAlignJustify, faEnvelope, faUser, faAngleDown, faWindowClose,faRedo]
);
export default defineComponent({...});
</script>