https://fontawesome.com
npm install --save-dev @fortawesome/fontawesome-free@5.15.3
main.js
import { createApp } from 'vue' import App from './App.vue' import '@fortawesome/fontawesome-free/css/all.css' import '@fortawesome/fontawesome-free/js/all' createApp(App).mount('#app')
App.vue
<template> <Example></Example> </template> <script> import Example from './components/Example' export default { name: 'App', components: { Example } } </script> <style> </style>
Example.vue
<template> <div> <i class="fas fa-user"></i> <i class="fab fa-apple"></i> <i class="far fa-envelope"></i> <i class="far fa-grin"></i> <hr> <i class="fas fa-align-center"></i> <i class="fas fa-align-justify"></i> <i class="fas fa-align-left"></i> <i class="fas fa-align-right"></i> <hr> <i class="fas fa-angle-double-down"></i> <i class="fas fa-angle-double-left"></i> <i class="fas fa-angle-double-right"></i> <i class="fas fa-angle-double-up"></i> </div> </template> <script> export default { name: "Example" } </script> <style scoped> div svg{ margin:20px; } </style>
浏览器显示效果