How to use iconfont to parse vue files

This article mainly introduces "how to use iconfont analysis of vue files". In daily operation, I believe many people have doubts about how to use iconfont analysis of vue files. I have consulted all kinds of materials and sorted out simple and easy operation methods. I hope to help you answer the doubts about "how to use iconfont analysis of vue files"! Next, please follow the small series to learn together!

vue using iconfont

1. Import font files into assets

2. Main.js import

import '@/assets/icon/iconfont.css';

3. Use

Note that iconfont must be added in front, otherwise it is an empty box

Correct use of iconfont in projects

1. Open iconFont official website, select your favorite icon, and add shopping cart

2. Click the shopping cart to add to the item

3. Download locally

4. Put the downloaded files iconfont.css and iconfont.ttf under the project assets folder (you can create a css file or iconfont file)

5. Introduce iconfont.css style in main.js

import './ assets/iconfont/iconfont.css'

6. Reference in vue file

7. If an error is reported, you need to download the css-loader dependency package.

npm install css-loader --save Here, on the "vue file how to use iconfont parsing" learning is over, I hope to solve everyone's doubts. Theory and practice can better match to help everyone learn, go and try it! If you want to continue learning more relevant knowledge, please continue to pay attention to the website, Xiaobian will continue to strive to bring more practical articles for everyone!