把iconfont 图标导出为json
import re
import json
with open('iconfont.css', 'r', encoding='utf-8') as f:
content = f.read()
icons = []
matches = re.findall(r'\.icon-(.*?):before\s*{\s*content:\s*"(.*?)";', content)
for match in matches:
icon_name = match[0]
unicode_content = match[1]
icons.append({
"name": icon_name,
"class": f"icon-{icon_name}",
"unicode": unicode_content
})
with open('icons.json', 'w', encoding='utf-8') as f:
json.dump(icons, f, ensure_ascii=False, indent=4)
这个脚本会读取 iconfont 的 CSS 文件,提取出图标类名和 Unicode 编码,并生成一个 JSON 文件。
请注意,以上方法可能需要根据实际情况进行调整,并且如果 iconfont 的 CSS 结构发生变化,可能需要修改相应的正则表达式或处理逻辑。
在Vue中使用
<template>
<div>
<template v-for="iconClass in iconClasses">
<i :class="'iconfont '+ iconClass"></i>
</template>
</div>
</template>
<script>
import iconClasses from './icons.json';
export default {
data() {
return {
iconClasses,
};
},
};
</script>