fy-components-test 1.0.0 → 1.0.2

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 (8) hide show
  1. package/README.md +25 -16
  2. package/package.json +5 -1
  3. package/index.html +0 -13
  4. package/src/App.vue +0 -27
  5. package/src/components/MButton.vue +0 -122
  6. package/src/index.ts +0 -22
  7. package/src/main.ts +0 -10
  8. package/vite.config.ts +0 -32
package/README.md CHANGED
@@ -1,4 +1,13 @@
1
- # @miaoma/components
1
+ <!--
2
+ * @FileDescription:
3
+ * @Author: czh
4
+ * @Date: 2026-04-08 16:49:07
5
+ * @LastEditors: czh
6
+ * @LastEditTime: 2026-04-09 14:48:49
7
+ * @FilePath: \ai-ui\packages\components\README.md
8
+ -->
9
+
10
+ # fy-components-test
2
11
 
3
12
  基于 Element Plus 的二次封装组件库，提供更加易用、美观的 UI 组件。
4
13
 
@@ -14,13 +23,13 @@
14
23
 
15
24
  ```bash
16
25
  # 使用 npm
17
- npm install @miaoma/components element-plus
26
+ npm install fy-components-test element-plus
18
27
 
19
28
  # 使用 pnpm
20
- pnpm add @miaoma/components element-plus
29
+ pnpm add fy-components-test element-plus
21
30
 
22
31
  # 使用 yarn
23
- yarn add @miaoma/components element-plus
32
+ yarn add fy-components-test element-plus
24
33
  ```
25
34
 
26
35
  ## 引入
@@ -28,22 +37,22 @@ yarn add @miaoma/components element-plus
28
37
  ### 全局引入
29
38
 
30
39
  ```ts
31
- import { createApp } from 'vue'
32
- import App from './App.vue'
33
- import ElementPlus from 'element-plus'
34
- import 'element-plus/dist/index.css'
35
- import MiaomaComponents from '@miaoma/components'
36
-
37
- const app = createApp(App)
38
- app.use(ElementPlus)
39
- app.use(MiaomaComponents)
40
- app.mount('#app')
40
+ import { createApp } from 'vue';
41
+ import App from './App.vue';
42
+ import ElementPlus from 'element-plus';
43
+ import 'element-plus/dist/index.css';
44
+ import MiaomaComponents from 'fy-components-test';
45
+
46
+ const app = createApp(App);
47
+ app.use(ElementPlus);
48
+ app.use(MiaomaComponents);
49
+ app.mount('#app');
41
50
  ```
42
51
 
43
52
  ### 按需引入
44
53
 
45
54
  ```ts
46
- import { MButton } from '@miaoma/components'
55
+ import { MButton } from 'fy-components-test';
47
56
  ```
48
57
 
49
58
  ## 组件列表
@@ -63,4 +72,4 @@ import { MButton } from '@miaoma/components'
63
72
 
64
73
  ## 许可证
65
74
 
66
- MIT
75
+ MIT
package/package.json CHANGED
@@ -1,11 +1,15 @@
1
1
  {
2
2
  "name": "fy-components-test",
3
- "version": "1.0.0",
3
+ "version": "1.0.2",
4
4
  "description": "基于 Element Plus 的二次封装组件库",
5
5
  "type": "module",
6
6
  "main": "./dist/index.umd.js",
7
7
  "module": "./dist/index.es.js",
8
8
  "types": "./dist/index.d.ts",
9
+ "files": [
10
+ "dist",
11
+ "README.md"
12
+ ],
9
13
  "exports": {
10
14
  ".": {
11
15
  "import": "./dist/index.es.js",
package/index.html DELETED
@@ -1,13 +0,0 @@
1
- <!DOCTYPE html>
2
- <html lang="zh-CN">
3
- <head>
4
- <meta charset="UTF-8" />
5
- <link rel="icon" type="image/svg+xml" href="/vite.svg" />
6
- <meta name="viewport" content="width=device-width, initial-scale=1.0" />
7
- <title>组件库测试</title>
8
- </head>
9
- <body>
10
- <div id="app"></div>
11
- <script type="module" src="/src/main.ts"></script>
12
- </body>
13
- </html>
package/src/App.vue DELETED
@@ -1,27 +0,0 @@
1
- <template>
2
- <div style="padding: 20px;">
3
- <h1>组件库测试</h1>
4
- <div style="display: flex; gap: 10px; margin: 20px 0;">
5
- <m-button type="primary" text="主要按钮" />
6
- <m-button type="success" text="成功按钮" />
7
- <m-button type="warning" text="警告按钮" />
8
- <m-button type="danger" text="危险按钮" />
9
- <m-button type="info" text="信息按钮" />
10
- </div>
11
- <div style="display: flex; gap: 10px; margin: 20px 0;">
12
- <m-button type="primary" size="large" text="大按钮" />
13
- <m-button type="primary" size="default" text="默认按钮" />
14
- <m-button type="primary" size="small" text="小按钮" />
15
- <m-button type="primary" size="mini" text="迷你按钮" />
16
- </div>
17
- <div style="display: flex; gap: 10px; margin: 20px 0;">
18
- <m-button type="primary" plain text="朴素按钮" />
19
- <m-button type="primary" round text="圆角按钮" />
20
- <m-button type="primary" circle icon="el-icon-search" />
21
- </div>
22
- </div>
23
- </template>
24
-
25
- <script setup lang="ts">
26
- import { MButton } from './index'
27
- </script>
package/src/components/MButton.vue DELETED
@@ -1,122 +0,0 @@
1
- <template>
2
- <el-button
3
- :type="type"
4
- :size="size"
5
- :plain="plain"
6
- :round="round"
7
- :circle="circle"
8
- :disabled="disabled"
9
- :loading="loading"
10
- :icon="icon"
11
- :autofocus="autofocus"
12
- :native-type="nativeType"
13
- :tag="tag"
14
- @click="handleClick"
15
- >
16
- <template v-if="$slots.default">
17
- <slot></slot>
18
- </template>
19
- <template v-else>
20
- {{ text }}
21
- </template>
22
- </el-button>
23
- </template>
24
-
25
- <script lang="ts">
26
- export default {
27
- name: 'MButton',
28
- };
29
- </script>
30
-
31
- <script setup lang="ts">
32
- import { defineProps, defineEmits } from 'vue';
33
-
34
- defineProps({
35
- // 按钮类型
36
- type: {
37
- type: String,
38
- default: 'primary',
39
- validator: (value: string) => {
40
- return [
41
- 'primary',
42
- 'success',
43
- 'warning',
44
- 'danger',
45
- 'info',
46
- 'text',
47
- ].includes(value);
48
- },
49
- },
50
- // 按钮尺寸
51
- size: {
52
- type: String,
53
- default: 'default',
54
- validator: (value: string) => {
55
- return ['large', 'default', 'small', 'mini'].includes(value);
56
- },
57
- },
58
- // 是否朴素按钮
59
- plain: {
60
- type: Boolean,
61
- default: false,
62
- },
63
- // 是否圆角按钮
64
- round: {
65
- type: Boolean,
66
- default: false,
67
- },
68
- // 是否圆形按钮
69
- circle: {
70
- type: Boolean,
71
- default: false,
72
- },
73
- // 是否禁用
74
- disabled: {
75
- type: Boolean,
76
- default: false,
77
- },
78
- // 是否加载中
79
- loading: {
80
- type: Boolean,
81
- default: false,
82
- },
83
- // 图标
84
- icon: {
85
- type: String,
86
- default: '',
87
- },
88
- // 按钮文本
89
- text: {
90
- type: String,
91
- default: '',
92
- },
93
- // 是否自动聚焦
94
- autofocus: {
95
- type: Boolean,
96
- default: false,
97
- },
98
- // 原生 type 属性
99
- nativeType: {
100
- type: String,
101
- default: 'button',
102
- validator: (value: string) => {
103
- return ['button', 'submit', 'reset'].includes(value);
104
- },
105
- },
106
- // 自定义标签
107
- tag: {
108
- type: String,
109
- default: 'button',
110
- },
111
- });
112
-
113
- const emit = defineEmits(['click']);
114
-
115
- const handleClick = (event: MouseEvent) => {
116
- emit('click', event);
117
- };
118
- </script>
119
-
120
- <style scoped>
121
- /* 可以添加自定义样式 */
122
- </style>
package/src/index.ts DELETED
@@ -1,22 +0,0 @@
1
- import type { App } from 'vue'
2
- import MButton from './components/MButton.vue'
3
-
4
- const components = [
5
- MButton
6
- ]
7
-
8
- export const install = (app: App) => {
9
- components.forEach(component => {
10
- if (component.name) {
11
- app.component(component.name, component)
12
- }
13
- })
14
- }
15
-
16
- export {
17
- MButton
18
- }
19
-
20
- export default {
21
- install
22
- }
package/src/main.ts DELETED
@@ -1,10 +0,0 @@
1
- import { createApp } from 'vue'
2
- import App from './App.vue'
3
- import ElementPlus from 'element-plus'
4
- import 'element-plus/dist/index.css'
5
- import MiaomaComponents from './index'
6
-
7
- const app = createApp(App)
8
- app.use(ElementPlus)
9
- app.use(MiaomaComponents)
10
- app.mount('#app')
package/vite.config.ts DELETED
@@ -1,32 +0,0 @@
1
- import { defineConfig } from 'vite'
2
- import vue from '@vitejs/plugin-vue'
3
- import dts from 'vite-plugin-dts'
4
- import { resolve } from 'path'
5
- import { fileURLToPath, URL } from 'url'
6
-
7
- const __dirname = fileURLToPath(new URL('.', import.meta.url))
8
-
9
- export default defineConfig({
10
- plugins: [
11
- vue(),
12
- dts({
13
- insertTypesEntry: true
14
- })
15
- ],
16
- build: {
17
- lib: {
18
- entry: resolve(__dirname, 'src/index.ts'),
19
- name: 'MiaomaComponents',
20
- fileName: (format) => `index.${format}.js`
21
- },
22
- rollupOptions: {
23
- external: ['vue', 'element-plus'],
24
- output: {
25
- globals: {
26
- vue: 'Vue',
27
- 'element-plus': 'ElementPlus'
28
- }
29
- }
30
- }
31
- }
32
- })