阿里巴巴矢量引入方式

1.首先去阿里矢量图官网

https://www.iconfont.cn/collections/index?spm=a313x.7781069.1998910419.da2e3581b&type=1

2.在阿里矢量图官网把我们需要的矢量图加入到购物车里面

3.加入到购物车以后打开右上角的购物车图表,会在右侧弹出一个页面

4.然后我们选择添加至项目,然后在右上架有一个加号,点击加号,然后定义一个文件名, 名字可以随便定义

5.定义完文件名以后,点击确定,会跳转到你选择矢量图的那个页面,切记要选择Fonto class模式,一般情况下默认选中的就是这个,在我们使用的时候注意下就好啦,然后点击下载到本地

6.点击下载到本地以后,它会在左下角自动下载,下载完成后,点击三个点…,选择打开,它会弹出一个文件夹,

7.双击打开这个文件夹,会显示出来很多文件,把我下图标记的5个文件复制或者剪切都可以

8.接下来就去我们需要引入矢量图的项目中,找到assets这个文件夹,在下面创建一个iconfont这个文件,把我们刚才复制的5个文件放进去

9.在我们的项目根目录下找到main.js全局引入文件,把我们刚才复制的5个文件中有一个iconfont.css文件引入到全局

import ‘./assets/iconfont/iconfont.css’

9.然后在我们的项目中就可以使用啦,当我们把鼠标放上面的时候,它会自动弹出隐藏层,我们点击复制代码,就可以啦,然后把他粘贴到标签内就可以啦

Published by

风君子

独自遨游何稽首 揭天掀地慰生平

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注