Vue3安装Vuetify和使用Fontawesome6

vue3需要使用3版本的vuetify

"vuetify": "^3.0.0-beta.0",

首先项目里需要有fontawesome，提示：css和webfonts文件夹即可
src下新建plugins文件夹，命名例如vuetify.js

import '@/assets/css/fontawesome6/css/all.min.css'
import 'vuetify/lib/styles/main.sass'
import { createVuetify } from 'vuetify'
import * as components from 'vuetify/lib/components/index'
import * as directives from 'vuetify/lib/directives/index'
import { aliases, fa } from 'vuetify/lib/iconsets/fa'

export const vuetify = createVuetify({
    icons: {
        defaultSet: 'fa',
        aliases,
        sets: {
            fa,
        },
    },
    components,
    directives,
    theme: {
        themes: {
            light: {
                colors: {
                    primary: '#41b883',
                    background: '#35495e',
                    error: '#d63031',
                    info: '#0984e3',
                    secondary: '#fdcb6e',
                    success: '#00cec9',
                    surface: '#6c5ce7',
                    warning: '#2d3436',
                },
                dark: false,
                variables: {},
            },
        },
    },
})

import { vuetify } from "./plugins/vuetify"
const app = createApp(App)
app.use(vuetify)
app.mount('#app')

使用图标

<template>
  <v-icon icon="fa-check" />
</template>

👉推荐！！！【腾讯云】爆款2核4G云服务器首年74元/年

👉推荐！！！【腾讯云】1核2G5M轻量应用服务器50元/年

【腾讯云】云数据库低至9.9/年！MySQL7.4元/月

【阿里云】ECS云服务器特惠

【阿里云】服务器首购优惠

如果文章对您有帮助，扫个红包码呗