vue-cli3 font-awesome 도입 작업

1248 단어 vue-cli3font-awesome
패키지에서요.json 추가
"font-awesome": "^4.7.0"
npm 설치 실행
메인js 도입
//font
import "font-awesome/css/font-awesome.min.css"
보충 지식: Vue2.0에 font-awesome을 도입하고 Element-ui에 font-awesome의 icon을 정확하게 표시합니다
다음과 같습니다.
npm install font-awesome --save
메인js에서 도입
import 'font-awesome/css/font-awesome.css'
앱에서vue의

[class^="el-icon-fa"], [class*=" el-icon-fa"] {
  display: inline-block;
  font: normal normal normal 14px/1 FontAwesome!important;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
 }
 @import '../node_modules/font-awesome/css/font-awesome.css';
 $fa-css-prefix: el-icon-fa;
정상 사용

 <i class="fa fa-user"></i>
    <i class="fa fa-tree"></i>
    <el-button icon="el-icon-fa fa-user" size="mini"> </el-button>
    <el-button icon="el-icon-fa fa-tree" size="mini"> </el-button>
상기 vue-cli3에서 font-awesome을 도입한 조작은 바로 편집자가 여러분에게 공유한 모든 내용입니다. 여러분께 참고가 되고 저희를 많이 사랑해 주시기 바랍니다.

좋은 웹페이지 즐겨찾기