chore: 整理main

src/main.ts

@@ -11,74 +11,13 @@ import '@/assets/styles/font.scss'
 import 'animate.css'
 
 // 自定义插件
-import Contextmenu from './plugins/contextmenu'
-import ClickOutside from './plugins/clickOutside'
-import IconPark from './plugins/iconPark'
-
-// 自定义组件
-import FileInput from '@/components/FileInput.vue'
-import SvgWrapper from '@/components/SvgWrapper.vue'
-import CheckboxButton from '@/components/CheckboxButton.vue'
-import CheckboxButtonGroup from '@/components/CheckboxButtonGroup.vue'
-import ColorPicker from '@/components/ColorPicker/index.vue'
-import FullscreenSpin from '@/components/FullscreenSpin.vue'
-
-// antd 组件
-import {
-  InputNumber,
-  Divider,
-  Button,
-  Tooltip,
-  Popover,
-  Slider,
-  Select,
-  Switch,
-  Radio,
-  Input,
-  Modal,
-  Dropdown,
-  Menu,
-  Checkbox,
-  Drawer,
-  Spin,
-} from 'ant-design-vue'
+import IconPark from '@/plugins/iconPark'
+import Antd from '@/plugins/antd'
+import PptCustomComponent from '@/plugins/PptCustomComponent'
 
 const app = createApp(App)
-
-app.directive('contextmenu', Contextmenu)
-app.directive('click-outside', ClickOutside)
 app.use(IconPark)
-
-app.component('FileInput', FileInput)
-app.component('SvgWrapper', SvgWrapper)
-app.component('CheckboxButton', CheckboxButton)
-app.component('CheckboxButtonGroup', CheckboxButtonGroup)
-app.component('ColorPicker', ColorPicker)
-app.component('FullscreenSpin', FullscreenSpin)
-
-app.component('InputNumber', InputNumber)
-app.component('Divider', Divider)
-app.component('Button', Button)
-app.component('ButtonGroup', Button.Group)
-app.component('Tooltip', Tooltip)
-app.component('Popover', Popover)
-app.component('Slider', Slider)
-app.component('Select', Select)
-app.component('SelectOption', Select.Option)
-app.component('SelectOptGroup', Select.OptGroup)
-app.component('Switch', Switch)
-app.component('Radio', Radio)
-app.component('RadioGroup', Radio.Group)
-app.component('RadioButton', Radio.Button)
-app.component('Input', Input)
-app.component('InputGroup', Input.Group)
-app.component('Modal', Modal)
-app.component('Dropdown', Dropdown)
-app.component('Menu', Menu)
-app.component('MenuItem', Menu.Item)
-app.component('Checkbox', Checkbox)
-app.component('Drawer', Drawer)
-app.component('Spin', Spin)
-
+app.use(Antd)
+app.use(PptCustomComponent)
 app.use(store, key)
 app.mount('#app')

src/plugins/PptCustomComponent.ts

@@ -0,0 +1,24 @@
+import { App } from 'vue'
+// 自定义插件
+import Contextmenu from './contextmenu'
+import ClickOutside from './clickOutside'
+import FileInput from '@/components/FileInput.vue'
+import SvgWrapper from '@/components/SvgWrapper.vue'
+import CheckboxButton from '@/components/CheckboxButton.vue'
+import CheckboxButtonGroup from '@/components/CheckboxButtonGroup.vue'
+import ColorPicker from '@/components/ColorPicker/index.vue'
+import FullscreenSpin from '@/components/FullscreenSpin.vue'
+
+export default {
+  install(app: App) {
+    // 插入元素
+    app.directive('contextmenu', Contextmenu)
+    app.directive('click-outside', ClickOutside)
+    app.component('FileInput', FileInput)
+    app.component('SvgWrapper', SvgWrapper)
+    app.component('CheckboxButton', CheckboxButton)
+    app.component('CheckboxButtonGroup', CheckboxButtonGroup)
+    app.component('ColorPicker', ColorPicker)
+    app.component('FullscreenSpin', FullscreenSpin)
+  }
+}

src/plugins/antd.ts

@@ -0,0 +1,49 @@
+import { App } from 'vue'
+// antd 组件
+import {
+  InputNumber,
+  Divider,
+  Button,
+  Tooltip,
+  Popover,
+  Slider,
+  Select,
+  Switch,
+  Radio,
+  Input,
+  Modal,
+  Dropdown,
+  Menu,
+  Checkbox,
+  Drawer,
+  Spin,
+} from 'ant-design-vue'
+
+export default {
+  install(app: App) {
+    // 插入元素
+    app.component('InputNumber', InputNumber)
+    app.component('Divider', Divider)
+    app.component('Button', Button)
+    app.component('ButtonGroup', Button.Group)
+    app.component('Tooltip', Tooltip)
+    app.component('Popover', Popover)
+    app.component('Slider', Slider)
+    app.component('Select', Select)
+    app.component('SelectOption', Select.Option)
+    app.component('SelectOptGroup', Select.OptGroup)
+    app.component('Switch', Switch)
+    app.component('Radio', Radio)
+    app.component('RadioGroup', Radio.Group)
+    app.component('RadioButton', Radio.Button)
+    app.component('Input', Input)
+    app.component('InputGroup', Input.Group)
+    app.component('Modal', Modal)
+    app.component('Dropdown', Dropdown)
+    app.component('Menu', Menu)
+    app.component('MenuItem', Menu.Item)
+    app.component('Checkbox', Checkbox)
+    app.component('Drawer', Drawer)
+    app.component('Spin', Spin)
+  }
+}