uniky 1.0.24 → 1.0.25

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/package.json +1 -1
  2. package/src/plugin/.skills/icon-update..md +116 -0
  3. package/src/plugin/components/icon.vue +67 -0
  4. package/src/plugin/static/iconfont.woff2 +0 -0
  5. /package/src/plugin/{skill.defined.ts → component.defined.ts} +0 -0
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "uniky",
3
- "version": "1.0.24",
3
+ "version": "1.0.25",
4
4
  "description": "uni-app 开发工具库，包含 hooks、http 请求和 vite 插件",
5
5
  "type": "module",
6
6
  "main": "./src/lib/index.ts",
package/src/plugin/.skills/icon-update..md ADDED
@@ -0,0 +1,116 @@
1
+ ---
2
+ name: icon-update
3
+ description: 根据给出iconfont下载文件夹去更新我的icon信息
4
+ ---
5
+
6
+ # 更新逻辑说明
7
+
8
+ ## iconfont 下载文件夹结构
9
+ /
10
+ ├── demo_index.html # 演示页面 (24K)
11
+ ├── demo.css # 演示样式 (8.2K)
12
+ ├── iconfont.css # 字体样式文件 (1.4K)
13
+ ├── iconfont.js # JavaScript 版本 (23K)
14
+ ├── iconfont.json # 图标配置信息 (3.5K)
15
+ ├── iconfont.ttf # TrueType 字体 (5.6K)
16
+ ├── iconfont.woff # Web 字体格式 (3.3K)
17
+ └── iconfont.woff2 # Web 字体格式2 (2.7K)
18
+
19
+ ### 关键文件 iconfont.json
20
+ ```json
21
+ {
22
+ "id": "5127762",
23
+ "name": "noted",
24
+ "font_family": "iconfont",
25
+ "css_prefix_text": "icon-",
26
+ "description": "",
27
+ "glyphs": [
28
+ {
29
+ "icon_id": "46919908",
30
+ "name": "delete",
31
+ "font_class": "delete",
32
+ "unicode": "#xe604",
33
+ "unicode_decimal": 59062
34
+ }
35
+ ...
36
+ ]
37
+ }
38
+
39
+ ```
40
+
41
+ ## 通过iconfont下载文件夹结构信息 创建或更新icon.vue文件；同时更新static/iconfont.woff2 文件
42
+
43
+ src/component/icon.vue 基础示例如下
44
+ ```vue
45
+ <template>
46
+ <text class="me-font">{{ icon }}</text>
47
+ </template>
48
+
49
+ <script lang="ts" setup>
50
+ import { ref, watch } from "vue";
51
+
52
+ let IconMap = {
53
+ delete: "&#xe604;",
54
+ addFill: "&#xe606;",
55
+ };
56
+
57
+ type IconName = keyof typeof IconMap;
58
+
59
+ const props = defineProps<{
60
+ name: IconName;
61
+ }>();
62
+
63
+ let value = IconMap[props.name] || "&#xe604;";
64
+ value = value.replace("&#x", "%u").replace(";", "");
65
+ value = unescape(value);
66
+ const icon = ref(value);
67
+
68
+ watch(
69
+ () => props.name,
70
+ (val) => {
71
+ let iconStr = IconMap[val];
72
+ iconStr = iconStr.replace("&#x", "%u").replace(";", "");
73
+ iconStr = iconStr.replace("&#x", "%u").replace(";", "");
74
+ iconStr = unescape(iconStr);
75
+ icon.value = iconStr;
76
+ },
77
+ );
78
+ </script>
79
+
80
+ <style lang="scss">
81
+ @font-face {
82
+ font-family: "iconfont";
83
+ /* #ifdef H5 */
84
+ src: url("/h5/static/iconfont.woff2") format("woff2");
85
+ /* #endif */
86
+ /* #ifdef MP-WEIXIN */
87
+ //src: url('//at.alicdn.com/t/c/font_2942740_av9lw25yela.woff2?t=1707276070685') format('woff2');
88
+ src: url("/static/iconfont.woff2") format("woff2");
89
+
90
+ /* #endif */
91
+ /* #ifdef APP-PLUS */
92
+ src: url("/static/iconfont.woff2") format("woff2");
93
+ /* #endif */
94
+ }
95
+
96
+ /*!* 在线链接服务仅供平台体验和调试使用，平台不承诺服务的稳定性，企业客户需下载字体包自行发布使用并做好备份。 *!*/
97
+ /*@font-face {*/
98
+ /* font-family: 'iconfont'; !* Project id 2942740 *!*/
99
+ /* src: url('//at.alicdn.com/t/c/font_2942740_oa0mdid0yx.woff2?t=1694135753186') format('woff2');*/
100
+ /*}*/
101
+
102
+ .me-font {
103
+ font-family: iconfont;
104
+ text-align: center;
105
+ line-height: 1;
106
+ display: flex;
107
+ flex-direction: row;
108
+ justify-content: center;
109
+ align-items: center;
110
+ }
111
+ </style>
112
+ ```
113
+
114
+ （1）创建更新src/component/icon.vue 文件，文件中 IconMap 来自于iconfont.json中 glyphs 下的name，unicode 项；注意按照基础示例中IconMap 的值前面须添加'&'前置字符
115
+
116
+ （2）更新的后同时将iconfont.woff2文件拷贝跟新到src/static/ 文件夹下
package/src/plugin/components/icon.vue ADDED
@@ -0,0 +1,67 @@
1
+ <template>
2
+ <text class="me-font">{{ icon }}</text>
3
+ </template>
4
+
5
+ <script lang="ts" setup>
6
+ import { ref, watch } from "vue";
7
+
8
+ let IconMap = {
9
+ delete: "&#xe604;",
10
+ addFill: "&#xe606;",
11
+ };
12
+
13
+ type IconName = keyof typeof IconMap;
14
+
15
+ const props = defineProps<{
16
+ name: IconName;
17
+ }>();
18
+
19
+ let value = IconMap[props.name] || "&#xe604;";
20
+ value = value.replace("&#x", "%u").replace(";", "");
21
+ value = unescape(value);
22
+ const icon = ref(value);
23
+
24
+ watch(
25
+ () => props.name,
26
+ (val) => {
27
+ let iconStr = IconMap[val];
28
+ iconStr = iconStr.replace("&#x", "%u").replace(";", "");
29
+ iconStr = iconStr.replace("&#x", "%u").replace(";", "");
30
+ iconStr = unescape(iconStr);
31
+ icon.value = iconStr;
32
+ },
33
+ );
34
+ </script>
35
+
36
+ <style lang="scss">
37
+ @font-face {
38
+ font-family: "iconfont";
39
+ /* #ifdef H5 */
40
+ src: url("/h5/static/iconfont.woff2") format("woff2");
41
+ /* #endif */
42
+ /* #ifdef MP-WEIXIN */
43
+ //src: url('//at.alicdn.com/t/c/font_2942740_av9lw25yela.woff2?t=1707276070685') format('woff2');
44
+ src: url("/static/iconfont.woff2") format("woff2");
45
+
46
+ /* #endif */
47
+ /* #ifdef APP-PLUS */
48
+ src: url("/static/iconfont.woff2") format("woff2");
49
+ /* #endif */
50
+ }
51
+
52
+ /*!* 在线链接服务仅供平台体验和调试使用，平台不承诺服务的稳定性，企业客户需下载字体包自行发布使用并做好备份。 *!*/
53
+ /*@font-face {*/
54
+ /* font-family: 'iconfont'; !* Project id 2942740 *!*/
55
+ /* src: url('//at.alicdn.com/t/c/font_2942740_oa0mdid0yx.woff2?t=1694135753186') format('woff2');*/
56
+ /*}*/
57
+
58
+ .me-font {
59
+ font-family: iconfont;
60
+ text-align: center;
61
+ line-height: 1;
62
+ display: flex;
63
+ flex-direction: row;
64
+ justify-content: center;
65
+ align-items: center;
66
+ }
67
+ </style>
package/src/plugin/static/iconfont.woff2 ADDED
Binary file