自动给模板生成 Inline-Svg

在写 Hugo/Hexo 等主题的时候,如果需要使用 inline svg,则经常要手工从官方文档 copy 或者下载 collection 再自行拆分。于是有了这个项目,自动从模板中提取需要使用的 icon,生成 svg 到独立的模板文件内,模板编写者不再需要考虑 HTML 与图标来源,只需要写好模板,然后执行这个 cli 工具即可。

比如,在模板内编写 {{ partial "utils/icons" "logo-archive" }},工具会为你生成:

{{ $icon := . }}

{{ if eq $icon "archive" }}
<svg xmlns='http://www.w3.org/2000/svg' class='ionicon' viewBox='0 0 512 512'><path d='M64 164v244a56 56 0 0056 56h272a56 56 0 0056-56V164a4 4 0 00-4-4H68a4 4 0 00-4 4zm267 151.63l-63.69 63.68a16 16 0 01-22.62 0L181 315.63c-6.09-6.09-6.65-16-.85-22.38a16 16 0 0123.16-.56L240 329.37V224.45c0-8.61 6.62-16 15.23-16.43A16 16 0 01272 224v105.37l36.69-36.68a16 16 0 0123.16.56c5.8 6.37 5.24 16.29-.85 22.38z'/><rect x='32' y='48' width='448' height='80' rx='32' ry='32'/></svg>
{{ end }}

Github: https://github.com/wayjam/template-icon-extractor/,欢迎提交 PR。

Published At
Tagged with