基本概念

font-awesome：提供可縮放矢量圖標,它可以被定制大小、顏色、陰影以及任何可以用CSS的樣式。

官網：https://fontawesome.com/

非官方中文網：http://www.fontawesome.com.cn/

解決方案

方法一：npm安裝

1、安裝

npm install font-awesome --save

2、引入

import Vue from 'vue' import App from './App.vue' import router from "./router"; import $ from 'jquery' import 'bootstrap' import 'bootstrap/dist/css/bootstrap.css'; import 'bootstrap/dist/js/bootstrap.min.js'; import 'font-awesome/css/font-awesome.min.css';Vue.config.productionTip = falsenew Vue({render: h => h(App),router }).$mount('#app')

方法二：下載

1、下載

在官網下載代碼到本地，現在應該是font-awesome-4.7

2、拷貝

把font-awesome整個文件夾放到static文件夾中

3、修改HTML

在index.html中加上

<link rel="stylesheet" href="/static/font-awesome-4.7/css/font-awesome.min.css">

參考文章

https://segmentfault.com/q/1010000009795785/a-1020000009796355

https://www.cnblogs.com/CyLee/p/9391344.html

https://blog.csdn.net/qq_34258593/article/details/81316153

總結

以上是生活随笔為你收集整理的Vue 4.0——整合font-awesome解决方案的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。