页面中引用了大量的 svg 小图标，有什么方式可以合并图标，减少些请求数

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

Dive into HTML5

› http://diveintohtml5.org/

这是一个创建于 1727 天前的主题，其中的信息可能已经有所发展或是发生改变。

一般用什么方法合并 svg 小图标，有没有类似图片 sprites 的方法可以借用的？

8 条回复 • 2020-09-26 18:39:11 +08:00

hapboy

2020-03-13 00:03:59 +08:00

现成的解决方案：iconfont

lisisi

2020-03-13 00:16:24 +08:00

@hapboy 引用一个 iconfont 完整库太大了，只需要大约 100 个左右的图标，所以考虑自己合并

hapboy

2020-03-13 00:18:46 +08:00

@lisisi #2 https://www.iconfont.cn/ 可以自己上传 SVG 合并

designer

2020-03-13 00:19:44 +08:00 via iPhone

svg 打包成 iconfont 图标字体 https://icomoon.io/
我自己的一套图标就是用这个方案

mytharcher

2020-03-13 08:40:35 +08:00 via Android

服务端配置 HTTP2 解君愁。

kaka1

2020-03-13 09:02:56 +08:00

webpack 可以配置 svg 雪碧图

liduanjie

2020-09-07 12:53:45 +08:00

cdn

mostkia

2020-09-26 18:39:11 +08:00

用 ico 字库啊，嫌弃大可以自己定制，我自己就有相关项目在用，字库总大小也就几十 k，减少了非常多的并发数量，而且可以随意修改颜色，挺好的。