在vue-cli的組件模板里使用font-awesome的兩種方法

更新時間：2018年09月28日 09:33:21 作者：夏天的風歐陽冰嫣

今天小編就為大家分享一篇在vue-cli的組件模板里使用font-awesome的兩種方法，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧

方法一：

npm install font-awesome

在main.js里添加import 'font-awesome/css/font-awesome.css'

方法二：

在官網(wǎng)下載代碼到本地，現(xiàn)在應該是font-awesome-4.7，把整個文件夾放到static文件夾中，然后在index.html中加上<link

rel="stylesheet" href="/static/font-awesome-4.7/css/font-awesome.min.css" rel="external nofollow" >，應該就可以了。

使用方法：<i class="fa fa-home fa-lg"> 主頁</i>

以上這篇在vue-cli的組件模板里使用font-awesome的兩種方法就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持腳本之家。

您可能感興趣的文章:

vue實現(xiàn)移動端touch拖拽排序
這篇文章主要為大家詳細介紹了vue實現(xiàn)移動端touch拖拽排序，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2022-07-07
mockjs+vue頁面直接展示數(shù)據(jù)的方法
這篇文章主要介紹了mockjs+vue頁面直接展示數(shù)據(jù)的方法，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
2018-12-12
vue實現(xiàn)移動端拖動排序
這篇文章主要為大家詳細介紹了vue實現(xiàn)移動端拖動排序，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2020-08-08
vue 自定義指令directives及其常用鉤子函數(shù)說明
這篇文章主要介紹了vue 自定義指令directives及其常用鉤子函數(shù)說明，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教
2022-01-01
vue.extend,mixins和vue.component的區(qū)別及說明
Vue.extend 創(chuàng)建Vue的子類,可視為組件構造函數(shù),Vue.mixin 允許全局添加方法或?qū)傩?方便所有組件使用,Vue.component 是插件注冊方法,通過Vue.extend創(chuàng)建的組件實例可以注冊到Vue全局,使其在任何組件中可用
2024-09-09
vue 計時器組件的實現(xiàn)代碼
本篇文章主要介紹了vue 計時器組件的實現(xiàn)代碼，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
2017-09-09
Vue3使用Element?Plus實現(xiàn)列表界面的方法步驟
寫后臺管理的時候會有很多列表以及相應的條件查詢,下面這篇文章主要給大家介紹了關于Vue3使用Element?Plus實現(xiàn)列表界面的方法步驟,文中通過實例代碼介紹的非常詳細,需要的朋友可以參考下
2023-04-04
一篇文章搞懂Vue3中如何使用ref獲取元素節(jié)點
過去在Vue2中,我們采用ref來獲取標簽的信息,用以替代傳統(tǒng) js 中的 DOM 行為,下面這篇文章主要給大家介紹了關于如何通過一篇文章搞懂Vue3中如何使用ref獲取元素節(jié)點的相關資料,需要的朋友可以參考下
2022-11-11
Vue的模板語法以及實戰(zhàn)案例
Vue使用了基于HTML的模板語法,允許開發(fā)者聲明式地將DOM綁定至底層Vue實例的數(shù)據(jù),下面這篇文章主要給大家介紹了關于Vue的模板語法以及案例的相關資料,文中通過實例代碼介紹的非常詳細,需要的朋友可以參考下
2022-06-06
Vue 組件之間的通信方式詳解
在 Vue.js 中,組件是構建應用程序的基本單位,然而,當你的應用程序變得復雜時,組件之間的通信變得至關重要,本文將介紹幾種 Vue 組件之間通信的方式,幫助你更好地管理和組織代碼,感興趣的朋友一起看看吧
2024-06-06