-
Notifications
You must be signed in to change notification settings - Fork 0
/
update-icons.js
81 lines (65 loc) · 1.8 KB
/
update-icons.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
import path from "node:path";
import feather from "feather-icons";
import fs from "fs-extra";
import pascalcase from "pascalcase";
const { icons } = feather;
const templateToComponent = (icon) => `<template>
<svg
xmlns="http://www.w3.org/2000/svg"
stroke-linecap="round"
stroke-linejoin="round"
v-bind="attrs"
:class="$attrs.class"
:style="styles"
>
${icon.contents}
</svg>
</template>
<script setup lang="ts">
import { computed, useAttrs } from "vue";
defineOptions({ name: "${icon.pascalCasedComponentName}", inheritAttrs: false });
const $attrs = useAttrs();
const props = defineProps({
/** icon 大小, 默认 24 */
size: {
type: [String, Number],
},
/** icon 颜色 */
color: {
type: String,
default: "currentColor",
},
});
const styles = computed(() => {
const size = props.size ? { width: props.size, height: props.size } : {};
const color = { color: props.color };
return { ...size, ...color };
});
const attrs = {
viewBox: "0 0 24 24",
"shape-rendering": "geometricPrecision",
width: 24,
height: 24,
fill: 'none',
stroke:"currentColor",
strokeWidth: '1.5',
...$attrs,
};
</script>`;
Object.values(feather.icons).forEach((icon) => {
icon.pascalCasedComponentName = pascalcase(`g_icon_${icon.name}`);
});
Object.values(icons).forEach((icon) => {
const component = templateToComponent(icon);
const filepath = `./src/components/${icon.pascalCasedComponentName}.vue`;
fs.ensureDir(path.dirname(filepath)).then(() =>
fs.writeFile(filepath, component, "utf8")
);
});
const defaults = Object.values(feather.icons)
.map(
(icon) =>
`export { default as ${icon.pascalCasedComponentName} } from './components/${icon.pascalCasedComponentName}.vue'`
)
.join("\n\n");
fs.outputFile("./src/index.ts", defaults, "utf8");