vue中引入字体图标的方法
引入图标后不必再把图片下载下来放到项目中,下面是我自己的操作步骤:
1.在阿里巴巴矢量图标库找好图标后,不点下载,点击购物车,添加至项目
2.若之前未添加过项目则手动新增项目,若添加过直接点击选择对应项目添加;
3.点击下载你至本地并解压
4.在自己项目中新建iconfont文件夹,将解压的文件夹中iconfont.css文件导入
5.在iconfont.css中把字体引入方式改为绝对路径
6.在main.js中引入样式
或在APP.vue中引入
7.需注意,每次新增图标后,需更新iconfont.css代码;将新图标添加至项目后提示点击更新代码,更新后重新复制代码去iconfont.css中替换;
注:图标下方名称即为引用时的class名