如果iconfont图标库还不能满足需求,那么我们就需要自己制作svg图标,下面主要讲解怎么在系统中,使用svg图标。
-
在
vite.config.ts
里面,我们配置了svg图标相关信息,如下所示:
-
上面指定了svg图标需要放在
src/icons/svg
下面,且名称为icon-[dir]-[name]
。如svg文件是/src/icons/svg/404.svg
,则名称为:icon-404
,如下所示:
-
我们完成上面的步骤后,就可以使用svg图标了,如下所示:
<svg-icon icon="icon-404"></svg-icon>