From 8d33f2f843c1c5e8c2b12af254d326238e7c7401 Mon Sep 17 00:00:00 2001
From: tangjinzhou <415800467@qq.com>
Date: Sun, 27 Jul 2025 16:40:12 +0800
Subject: [PATCH] feat: update configuration for aliasing

---
 apps/playground/src/main.ts                   |  3 +-
 apps/playground/src/pages/button/basic.vue    | 10 +++---
 .../playground/src}/typings/global.d.ts       |  4 ++-
 apps/playground/tsconfig.json                 |  3 +-
 apps/playground/vite.config.ts                |  1 +
 packages/ui/src/components/button/Button.vue  | 26 ++++++++++++++
 packages/ui/src/components/button/index.ts    | 10 ++++++
 packages/ui/src/components/button/meta.ts     | 36 +++++++++++++++++++
 packages/ui/src/components/index.ts           |  1 +
 packages/ui/src/index.ts                      | 19 +++++-----
 packages/ui/src/shims-app.d.ts                |  5 ---
 packages/ui/vite.config.ts                    |  8 ++---
 12 files changed, 100 insertions(+), 26 deletions(-)
 rename {packages/ui => apps/playground/src}/typings/global.d.ts (51%)
 create mode 100644 packages/ui/src/components/button/Button.vue
 create mode 100644 packages/ui/src/components/button/index.ts
 create mode 100644 packages/ui/src/components/button/meta.ts
 create mode 100644 packages/ui/src/components/index.ts
 delete mode 100644 packages/ui/src/shims-app.d.ts

diff --git a/apps/playground/src/main.ts b/apps/playground/src/main.ts
index f09c151a4..f527de952 100644
--- a/apps/playground/src/main.ts
+++ b/apps/playground/src/main.ts
@@ -3,10 +3,11 @@ import { createApp } from 'vue'
 import { createRouter, createWebHistory } from 'vue-router'
 import App from './App.vue'
 import routes from './routes'
+import antd from 'ant-design-vue'
 
 const router = createRouter({
   history: createWebHistory(),
   routes,
 })
 
-createApp(App).use(router).mount('#app')
+createApp(App).use(router).use(antd).mount('#app')
diff --git a/apps/playground/src/pages/button/basic.vue b/apps/playground/src/pages/button/basic.vue
index ba6239acf..9a6d2daba 100644
--- a/apps/playground/src/pages/button/basic.vue
+++ b/apps/playground/src/pages/button/basic.vue
@@ -1,9 +1,9 @@
 <template>
   <div class="flex flex-col gap-2">
-    <button class="btn btn-primary">Primary Button</button>
-    <button class="btn btn-secondary">Default Button</button>
-    <button class="btn btn-error">Dashed Button</button>
-    <button class="btn btn-link">Text Button</button>
-    <button class="btn btn-link">Link Button</button>
+    <a-button class="btn btn-primary">Primary Button</a-button>
+    <a-button class="btn btn-secondary">Default Button</a-button>
+    <a-button class="btn btn-error">Dashed Button</a-button>
+    <a-button class="btn btn-link">Text Button</a-button>
+    <a-button class="btn btn-link">Link Button</a-button>
   </div>
 </template>
diff --git a/packages/ui/typings/global.d.ts b/apps/playground/src/typings/global.d.ts
similarity index 51%
rename from packages/ui/typings/global.d.ts
rename to apps/playground/src/typings/global.d.ts
index b35ed8c70..7e6f80043 100644
--- a/packages/ui/typings/global.d.ts
+++ b/apps/playground/src/typings/global.d.ts
@@ -1,5 +1,7 @@
 /* eslint-disable @typescript-eslint/consistent-type-imports */
 declare module 'vue' {
-  export interface GlobalComponents {}
+  export interface GlobalComponents {
+    AButton: typeof import('ant-design-vue').Button
+  }
 }
 export {}
diff --git a/apps/playground/tsconfig.json b/apps/playground/tsconfig.json
index 0ce414b2b..4ccb79b2f 100644
--- a/apps/playground/tsconfig.json
+++ b/apps/playground/tsconfig.json
@@ -5,7 +5,8 @@
   "compilerOptions": {
     "paths": {
       "@/*": ["./src/*"],
-      "~/*": ["./assets/*"]
+      "~/*": ["./assets/*"],
+      "ant-design-vue": ["./../../packages/ui/src/index.ts"]
     }
   }
 }
diff --git a/apps/playground/vite.config.ts b/apps/playground/vite.config.ts
index fe34ba97a..59a2e9b05 100644
--- a/apps/playground/vite.config.ts
+++ b/apps/playground/vite.config.ts
@@ -15,6 +15,7 @@ export default defineConfig({
     alias: {
       '@': resolve(__dirname, './src'),
       '~': resolve(__dirname, './assets'),
+      'ant-design-vue': resolve(__dirname, '../../packages/ui/src/index.ts'),
     },
   },
 })
diff --git a/packages/ui/src/components/button/Button.vue b/packages/ui/src/components/button/Button.vue
new file mode 100644
index 000000000..86cfec414
--- /dev/null
+++ b/packages/ui/src/components/button/Button.vue
@@ -0,0 +1,26 @@
+<template>
+  <button :class="classes" @click="$emit('click', $event)">
+    <slot></slot>
+  </button>
+</template>
+
+<script setup lang="ts">
+import { computed } from 'vue'
+import { buttonProps, buttonEmits, ButtonSlots } from './meta'
+
+const props = defineProps(buttonProps)
+
+defineEmits(buttonEmits)
+defineSlots<ButtonSlots>()
+
+const classes = computed(() => {
+  return [
+    'rounded-md px-4 py-2 cursor-pointer',
+    props.type,
+    {
+      'bg-primary text-primary-content': props.type === 'primary',
+      'bg-secondary text-secondary-content': props.type === 'secondary',
+    },
+  ]
+})
+</script>
diff --git a/packages/ui/src/components/button/index.ts b/packages/ui/src/components/button/index.ts
new file mode 100644
index 000000000..1f712dcac
--- /dev/null
+++ b/packages/ui/src/components/button/index.ts
@@ -0,0 +1,10 @@
+import { App, Plugin } from 'vue'
+import Button from './Button.vue'
+
+/* istanbul ignore next */
+Button.install = function (app: App) {
+  app.component('AButton', Button)
+  return app
+}
+
+export default Button as typeof Button & Plugin
diff --git a/packages/ui/src/components/button/meta.ts b/packages/ui/src/components/button/meta.ts
new file mode 100644
index 000000000..91a7101f6
--- /dev/null
+++ b/packages/ui/src/components/button/meta.ts
@@ -0,0 +1,36 @@
+import { PropType, ExtractPublicPropTypes } from 'vue'
+
+// Button Props
+export const buttonProps = {
+  /**
+   * Specifies the visual style variant of the button
+   * @default 'primary'
+   */
+  type: {
+    type: String as PropType<'primary' | 'secondary'>,
+    default: 'primary',
+  },
+} as const
+
+export type ButtonProps = ExtractPublicPropTypes<typeof buttonProps>
+
+// Button Emits
+export const buttonEmits = {
+  /**
+   * Triggered when the button is clicked by the user
+   * @param e - The native MouseEvent object
+   */
+  click: (e: MouseEvent) => e instanceof MouseEvent,
+} as const
+
+export type ButtonEmits = typeof buttonEmits
+
+// Button Slots
+export const buttonSlots = {
+  /**
+   * Main content slot for the button text or custom content
+   */
+  default: (_: any) => null as any,
+} as const
+
+export type ButtonSlots = typeof buttonSlots
diff --git a/packages/ui/src/components/index.ts b/packages/ui/src/components/index.ts
new file mode 100644
index 000000000..9743944ed
--- /dev/null
+++ b/packages/ui/src/components/index.ts
@@ -0,0 +1 @@
+export { default as Button } from './button'
diff --git a/packages/ui/src/index.ts b/packages/ui/src/index.ts
index 25821cdad..e79157863 100644
--- a/packages/ui/src/index.ts
+++ b/packages/ui/src/index.ts
@@ -1,6 +1,7 @@
 import { App } from 'vue'
 
-const components = {} as any
+import * as components from './components'
+export * from './components'
 export const install = function (app: App) {
   Object.keys(components).forEach(key => {
     const component = components[key]
@@ -8,14 +9,14 @@ export const install = function (app: App) {
       app.use(component)
     }
   })
-  app.config.globalProperties.$message = components.message
-  app.config.globalProperties.$notification = components.notification
-  app.config.globalProperties.$info = components.Modal.info
-  app.config.globalProperties.$success = components.Modal.success
-  app.config.globalProperties.$error = components.Modal.error
-  app.config.globalProperties.$warning = components.Modal.warning
-  app.config.globalProperties.$confirm = components.Modal.confirm
-  app.config.globalProperties.$destroyAll = components.Modal.destroyAll
+  // app.config.globalProperties.$message = components.message
+  // app.config.globalProperties.$notification = components.notification
+  // app.config.globalProperties.$info = components.Modal.info
+  // app.config.globalProperties.$success = components.Modal.success
+  // app.config.globalProperties.$error = components.Modal.error
+  // app.config.globalProperties.$warning = components.Modal.warning
+  // app.config.globalProperties.$confirm = components.Modal.confirm
+  // app.config.globalProperties.$destroyAll = components.Modal.destroyAll
   return app
 }
 
diff --git a/packages/ui/src/shims-app.d.ts b/packages/ui/src/shims-app.d.ts
deleted file mode 100644
index 2b97bd961..000000000
--- a/packages/ui/src/shims-app.d.ts
+++ /dev/null
@@ -1,5 +0,0 @@
-declare module '*.vue' {
-  import type { DefineComponent } from 'vue'
-  const component: DefineComponent<{}, {}, any>
-  export default component
-}
diff --git a/packages/ui/vite.config.ts b/packages/ui/vite.config.ts
index bdf04cb19..9bab2642d 100644
--- a/packages/ui/vite.config.ts
+++ b/packages/ui/vite.config.ts
@@ -1,7 +1,7 @@
-import { extendsConfig } from '@ant-design-vue/vite-config';
-import vue from '@ant-design-vue/vite-config/vue';
-import { resolve } from 'node:path';
-import tailwindcss from '@tailwindcss/vite';
+import { extendsConfig } from '@ant-design-vue/vite-config'
+import vue from '@ant-design-vue/vite-config/vue'
+import { resolve } from 'node:path'
+import tailwindcss from '@tailwindcss/vite'
 
 export default extendsConfig(vue(__dirname), {
   resolve: {