From c9c9e0d49483cb7ba3d3ec2c9ac3a0efa963e041 Mon Sep 17 00:00:00 2001
From: XiongAmao <onycat@live.cn>
Date: Wed, 23 Dec 2020 14:07:15 +0800
Subject: [PATCH] fix: app.use(comp.vue) type is not compatible (#1067)

---
 packages/alert/index.ts               | 4 +++-
 packages/aside/index.ts               | 5 ++++-
 packages/autocomplete/index.ts        | 5 ++++-
 packages/avatar/index.ts              | 5 ++++-
 packages/backtop/index.ts             | 5 ++++-
 packages/badge/index.ts               | 5 ++++-
 packages/breadcrumb-item/index.ts     | 5 ++++-
 packages/breadcrumb/index.ts          | 5 ++++-
 packages/button-group/index.ts        | 5 ++++-
 packages/button/index.ts              | 5 ++++-
 packages/calendar/index.ts            | 5 ++++-
 packages/card/index.ts                | 5 ++++-
 packages/carousel-item/index.ts       | 5 ++++-
 packages/carousel/index.ts            | 5 ++++-
 packages/cascader-panel/index.ts      | 5 ++++-
 packages/cascader/index.ts            | 5 ++++-
 packages/checkbox-button/index.ts     | 5 ++++-
 packages/checkbox-group/index.ts      | 5 ++++-
 packages/checkbox/index.ts            | 5 ++++-
 packages/collapse-item/index.ts       | 5 ++++-
 packages/collapse-transition/index.ts | 5 ++++-
 packages/collapse/index.ts            | 5 ++++-
 packages/color-picker/index.ts        | 5 ++++-
 packages/container/index.ts           | 5 ++++-
 packages/dialog/index.ts              | 5 ++++-
 packages/divider/index.ts             | 5 ++++-
 packages/drawer/index.ts              | 5 ++++-
 packages/dropdown-item/index.ts       | 5 ++++-
 packages/dropdown-menu/index.ts       | 5 ++++-
 packages/dropdown/index.ts            | 5 ++++-
 packages/footer/index.ts              | 5 ++++-
 packages/form-item/index.ts           | 5 ++++-
 packages/form/index.ts                | 5 ++++-
 packages/header/index.ts              | 4 +++-
 packages/icon/index.ts                | 5 ++++-
 packages/image/index.ts               | 5 ++++-
 packages/input-number/index.ts        | 5 ++++-
 packages/input/index.ts               | 5 ++++-
 packages/link/index.ts                | 5 ++++-
 packages/main/index.ts                | 5 ++++-
 packages/menu-item-group/index.ts     | 5 ++++-
 packages/menu-item/index.ts           | 5 ++++-
 packages/menu/index.ts                | 5 ++++-
 packages/option-group/index.ts        | 5 ++++-
 packages/page-header/index.ts         | 5 ++++-
 packages/popconfirm/index.ts          | 5 ++++-
 packages/popover/index.ts             | 6 +++++-
 packages/popper/index.ts              | 5 ++++-
 packages/progress/index.ts            | 5 ++++-
 packages/radio-button/index.ts        | 5 ++++-
 packages/radio-group/index.ts         | 5 ++++-
 packages/radio/index.ts               | 5 ++++-
 packages/rate/index.ts                | 5 ++++-
 packages/scrollbar/index.ts           | 5 ++++-
 packages/select/index.ts              | 5 ++++-
 packages/slider/index.ts              | 5 ++++-
 packages/step/index.ts                | 5 ++++-
 packages/steps/index.ts               | 5 ++++-
 packages/submenu/index.ts             | 5 ++++-
 packages/switch/index.ts              | 5 ++++-
 packages/tab-pane/index.ts            | 5 ++++-
 packages/table/index.ts               | 5 ++++-
 packages/tabs/index.ts                | 5 ++++-
 packages/tag/index.ts                 | 5 ++++-
 packages/time-select/index.ts         | 5 ++++-
 packages/timeline-item/index.ts       | 5 ++++-
 packages/timeline/index.ts            | 5 ++++-
 packages/transfer/index.ts            | 5 ++++-
 packages/transition/index.ts          | 1 +
 packages/tree/index.ts                | 5 ++++-
 packages/upload/index.ts              | 5 ++++-
 packages/utils/types.ts               | 4 ++++
 packages/virtual-list/index.ts        | 5 ++++-
 typings/vue-shim.d.ts                 | 6 ++++--
 74 files changed, 292 insertions(+), 73 deletions(-)

diff --git a/packages/alert/index.ts b/packages/alert/index.ts
index 9ddca450eb436..025a689cd1e40 100644
--- a/packages/alert/index.ts
+++ b/packages/alert/index.ts
@@ -1,9 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import Alert from './src/index.vue'
 
 Alert.install = (app: App): void => {
   app.component(Alert.name, Alert)
 }
 
-export default Alert
+const _Alert: SFCWithInstall<typeof Alert> = Alert
 
+export default _Alert
diff --git a/packages/aside/index.ts b/packages/aside/index.ts
index 157aaa67f2dfb..9124fee9fa322 100644
--- a/packages/aside/index.ts
+++ b/packages/aside/index.ts
@@ -1,9 +1,12 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import Aside from '../container/src/aside.vue'
 
 Aside.install = (app: App): void => {
   app.component(Aside.name, Aside)
 }
 
-export default Aside
+const _Aside: SFCWithInstall<typeof Aside> = Aside
+
+export default _Aside
 
diff --git a/packages/autocomplete/index.ts b/packages/autocomplete/index.ts
index 54ea47e6337ec..2f0dafc9c8d0f 100644
--- a/packages/autocomplete/index.ts
+++ b/packages/autocomplete/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import Autocomplete from './src/index.vue'
 
 Autocomplete.install = (app: App): void => {
   app.component(Autocomplete.name, Autocomplete)
 }
 
-export default Autocomplete
+const _Autocomplete: SFCWithInstall<typeof Autocomplete> = Autocomplete
+
+export default _Autocomplete
diff --git a/packages/avatar/index.ts b/packages/avatar/index.ts
index d2f2bdd277f3d..63943249ae760 100644
--- a/packages/avatar/index.ts
+++ b/packages/avatar/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import Avatar from './src/index.vue'
 
 Avatar.install = (app: App): void => {
   app.component(Avatar.name, Avatar)
 }
 
-export default Avatar
+const _Avatar: SFCWithInstall<typeof Avatar> = Avatar
+
+export default _Avatar
diff --git a/packages/backtop/index.ts b/packages/backtop/index.ts
index 0ebf3bec9f82f..a3ecfe66ebbf3 100644
--- a/packages/backtop/index.ts
+++ b/packages/backtop/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import Backtop from './src/index.vue'
 
 Backtop.install = (app: App): void => {
   app.component(Backtop.name, Backtop)
 }
 
-export default Backtop
+const _Backtop: SFCWithInstall<typeof Backtop> = Backtop
+
+export default _Backtop
diff --git a/packages/badge/index.ts b/packages/badge/index.ts
index 76a0c636e3b8e..f15d150f516c6 100644
--- a/packages/badge/index.ts
+++ b/packages/badge/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import Badge from './src/index.vue'
 
 Badge.install = (app: App): void => {
   app.component(Badge.name, Badge)
 }
 
-export default Badge
+const _Badge: SFCWithInstall<typeof Badge> = Badge
+
+export default _Badge
diff --git a/packages/breadcrumb-item/index.ts b/packages/breadcrumb-item/index.ts
index d436e11190457..f11deac86feab 100644
--- a/packages/breadcrumb-item/index.ts
+++ b/packages/breadcrumb-item/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import BreadcrumbItem from '../breadcrumb/src/item.vue'
 
 BreadcrumbItem.install = (app: App): void => {
   app.component(BreadcrumbItem.name, BreadcrumbItem)
 }
 
-export default BreadcrumbItem
+const _BreadcrumbItem: SFCWithInstall<typeof BreadcrumbItem> = BreadcrumbItem
+
+export default _BreadcrumbItem
diff --git a/packages/breadcrumb/index.ts b/packages/breadcrumb/index.ts
index b8e7b140683a3..2ffc902d0d455 100644
--- a/packages/breadcrumb/index.ts
+++ b/packages/breadcrumb/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import Breadcrumb from './src/index.vue'
 
 Breadcrumb.install = (app: App): void => {
   app.component(Breadcrumb.name, Breadcrumb)
 }
 
-export default Breadcrumb
+const _Breadcrumb: SFCWithInstall<typeof Breadcrumb> = Breadcrumb
+
+export default _Breadcrumb
diff --git a/packages/button-group/index.ts b/packages/button-group/index.ts
index 358388e223d2a..61411cf2d513c 100644
--- a/packages/button-group/index.ts
+++ b/packages/button-group/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import ButtonGroup from '../button/src/button-group.vue'
 
 ButtonGroup.install = (app: App): void => {
   app.component(ButtonGroup.name, ButtonGroup)
 }
 
-export default ButtonGroup
+const _ButtonGroup: SFCWithInstall<typeof ButtonGroup> = ButtonGroup
+
+export default _ButtonGroup
diff --git a/packages/button/index.ts b/packages/button/index.ts
index bca7185894816..7f4ff99ca4a65 100644
--- a/packages/button/index.ts
+++ b/packages/button/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import Button from './src/button.vue'
 
 Button.install = (app: App): void => {
   app.component(Button.name, Button)
 }
 
-export default Button
+const _Button: SFCWithInstall<typeof Button> = Button
+
+export default _Button
diff --git a/packages/calendar/index.ts b/packages/calendar/index.ts
index 66770ed4b3d73..b8ebe9dd875fa 100644
--- a/packages/calendar/index.ts
+++ b/packages/calendar/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import Calendar from './src/index.vue'
 
 Calendar.install = (app: App): void => {
   app.component(Calendar.name, Calendar)
 }
 
-export default Calendar
+const _Calendar: SFCWithInstall<typeof Calendar> = Calendar
+
+export default _Calendar
diff --git a/packages/card/index.ts b/packages/card/index.ts
index c3078ee2729dc..523dc2be57d87 100644
--- a/packages/card/index.ts
+++ b/packages/card/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import Card from './src/index.vue'
 
 Card.install = (app: App): void => {
   app.component(Card.name, Card)
 }
 
-export default Card
+const _Card: SFCWithInstall<typeof Card> = Card
+
+export default _Card
diff --git a/packages/carousel-item/index.ts b/packages/carousel-item/index.ts
index ef0b07d1458e1..9fd930cec42a6 100644
--- a/packages/carousel-item/index.ts
+++ b/packages/carousel-item/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import CarouselItem from '../carousel/src/item.vue'
 
 CarouselItem.install = (app: App): void => {
   app.component(CarouselItem.name, CarouselItem)
 }
 
-export default CarouselItem
+const _CarouselItem: SFCWithInstall<typeof CarouselItem> = CarouselItem
+
+export default _CarouselItem
diff --git a/packages/carousel/index.ts b/packages/carousel/index.ts
index 724066c589dcb..c19151179c58e 100644
--- a/packages/carousel/index.ts
+++ b/packages/carousel/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import Carousel from './src/main.vue'
 
 Carousel.install = (app: App): void => {
   app.component(Carousel.name, Carousel)
 }
 
-export default Carousel
+const _Carousel: SFCWithInstall<typeof Carousel> = Carousel
+
+export default _Carousel
diff --git a/packages/cascader-panel/index.ts b/packages/cascader-panel/index.ts
index af7a8f0232442..01173f7fe3e6e 100644
--- a/packages/cascader-panel/index.ts
+++ b/packages/cascader-panel/index.ts
@@ -1,4 +1,5 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import CascaderPanel from './src/index.vue'
 
 
@@ -6,6 +7,8 @@ CascaderPanel.install = (app: App): void => {
   app.component(CascaderPanel.name, CascaderPanel)
 }
 
-export default CascaderPanel
+const _CascaderPanel: SFCWithInstall<typeof CascaderPanel> = CascaderPanel
+
+export default _CascaderPanel
 export * from './src/types'
 export * from './src/config'
diff --git a/packages/cascader/index.ts b/packages/cascader/index.ts
index ecf630c5227aa..345cc7cb81619 100644
--- a/packages/cascader/index.ts
+++ b/packages/cascader/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import Cascader from './src/index.vue'
 
 Cascader.install = (app: App): void => {
   app.component(Cascader.name, Cascader)
 }
 
-export default Cascader
+const _Cascader: SFCWithInstall<typeof Cascader> = Cascader
+
+export default _Cascader
diff --git a/packages/checkbox-button/index.ts b/packages/checkbox-button/index.ts
index fd69b3fd30507..2451d3df8eac9 100644
--- a/packages/checkbox-button/index.ts
+++ b/packages/checkbox-button/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import CheckboxButton from '../checkbox/src/checkbox-button.vue'
 
 CheckboxButton.install = (app: App): void => {
   app.component(CheckboxButton.name, CheckboxButton)
 }
 
-export default CheckboxButton
+const _CheckboxButton: SFCWithInstall<typeof CheckboxButton> = CheckboxButton
+
+export default _CheckboxButton
diff --git a/packages/checkbox-group/index.ts b/packages/checkbox-group/index.ts
index f1acd627fc325..32455c28aeebe 100644
--- a/packages/checkbox-group/index.ts
+++ b/packages/checkbox-group/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import CheckboxGroup from '../checkbox/src/checkbox-group.vue'
 
 CheckboxGroup.install = (app: App): void => {
   app.component(CheckboxGroup.name, CheckboxGroup)
 }
 
-export default CheckboxGroup
+const _CheckboxGroup: SFCWithInstall<typeof CheckboxGroup> = CheckboxGroup
+
+export default _CheckboxGroup
diff --git a/packages/checkbox/index.ts b/packages/checkbox/index.ts
index 9a641e7cb0688..8aea36ea42fb3 100644
--- a/packages/checkbox/index.ts
+++ b/packages/checkbox/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import Checkbox from './src/checkbox.vue'
 
 Checkbox.install = (app: App): void => {
   app.component(Checkbox.name, Checkbox)
 }
 
-export default Checkbox
+const _Checkbox: SFCWithInstall<typeof Checkbox> = Checkbox
+
+export default _Checkbox
diff --git a/packages/collapse-item/index.ts b/packages/collapse-item/index.ts
index 9eaf992164d12..b3cce500646ae 100644
--- a/packages/collapse-item/index.ts
+++ b/packages/collapse-item/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import CollapseItem from '../collapse/src/collapse-item.vue'
 
 CollapseItem.install = (app: App): void => {
   app.component(CollapseItem.name, CollapseItem)
 }
 
-export default CollapseItem
+const _CollapseItem: SFCWithInstall<typeof CollapseItem> = CollapseItem
+
+export default _CollapseItem
diff --git a/packages/collapse-transition/index.ts b/packages/collapse-transition/index.ts
index 26012e9e33e35..c15dbc7efdf44 100644
--- a/packages/collapse-transition/index.ts
+++ b/packages/collapse-transition/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import CollapseTransition from '../transition/collapse-transition/index.vue'
 
 CollapseTransition.install = (app: App): void => {
   app.component(CollapseTransition.name, CollapseTransition)
 }
 
-export default CollapseTransition
+const _CollapseTransition: SFCWithInstall<typeof CollapseTransition> = CollapseTransition
+
+export default _CollapseTransition
diff --git a/packages/collapse/index.ts b/packages/collapse/index.ts
index 00ee2b46c3c7a..8afeacdcb0762 100644
--- a/packages/collapse/index.ts
+++ b/packages/collapse/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import Collapse from './src/collapse.vue'
 
 Collapse.install = (app: App): void => {
   app.component(Collapse.name, Collapse)
 }
 
-export default Collapse
+const _Collapse: SFCWithInstall<typeof Collapse> = Collapse
+
+export default _Collapse
diff --git a/packages/color-picker/index.ts b/packages/color-picker/index.ts
index cf41e4b366cc3..c0ca06ec19c00 100644
--- a/packages/color-picker/index.ts
+++ b/packages/color-picker/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import ColorPicker from './src/index.vue'
 
 ColorPicker.install = (app: App): void => {
   app.component(ColorPicker.name, ColorPicker)
 }
 
-export default ColorPicker
+const _ColorPicker: SFCWithInstall<typeof ColorPicker> = ColorPicker
+
+export default _ColorPicker
diff --git a/packages/container/index.ts b/packages/container/index.ts
index 36e930e5158b4..d22fa32ea6aaa 100644
--- a/packages/container/index.ts
+++ b/packages/container/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import Container from './src/container.vue'
 
 Container.install = (app: App): void => {
   app.component(Container.name, Container)
 }
 
-export default Container
+const _Container: SFCWithInstall<typeof Container> = Container
+
+export default _Container
diff --git a/packages/dialog/index.ts b/packages/dialog/index.ts
index 914c8d2fae9b8..a9383e497383a 100644
--- a/packages/dialog/index.ts
+++ b/packages/dialog/index.ts
@@ -1,9 +1,12 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import Dialog from './src/index.vue'
 
 Dialog.install = (app: App): void => {
   app.component(Dialog.name, Dialog)
 }
 
-export default Dialog
+const _Dialog: SFCWithInstall<typeof Dialog> = Dialog
+
+export default _Dialog
 export { default as useDialog } from './src/useDialog'
diff --git a/packages/divider/index.ts b/packages/divider/index.ts
index 5b5cc7fa02cc6..11222663778b4 100644
--- a/packages/divider/index.ts
+++ b/packages/divider/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import Divider from './src/index.vue'
 
 Divider.install = (app: App): void => {
   app.component(Divider.name, Divider)
 }
 
-export default Divider
+const _Divider: SFCWithInstall<typeof Divider> = Divider
+
+export default _Divider
diff --git a/packages/drawer/index.ts b/packages/drawer/index.ts
index 6a0c00618cbae..6cb8d9e82e65b 100644
--- a/packages/drawer/index.ts
+++ b/packages/drawer/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import Drawer from './src/index.vue'
 
 Drawer.install = (app: App): void => {
   app.component(Drawer.name, Drawer)
 }
 
-export default Drawer
+const _Drawer: SFCWithInstall<typeof Drawer> = Drawer
+
+export default _Drawer
diff --git a/packages/dropdown-item/index.ts b/packages/dropdown-item/index.ts
index 1a3be01345dea..5f7937c030e23 100644
--- a/packages/dropdown-item/index.ts
+++ b/packages/dropdown-item/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import DropdownItem from '../dropdown/src/dropdown-item.vue'
 
 DropdownItem.install = (app: App): void => {
   app.component(DropdownItem.name, DropdownItem)
 }
 
-export default DropdownItem
+const _DropdownItem: SFCWithInstall<typeof DropdownItem> = DropdownItem
+
+export default _DropdownItem
diff --git a/packages/dropdown-menu/index.ts b/packages/dropdown-menu/index.ts
index a8f905192c38a..39471b849b73a 100644
--- a/packages/dropdown-menu/index.ts
+++ b/packages/dropdown-menu/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import DropdownMenu from '../dropdown/src/dropdown-menu.vue'
 
 DropdownMenu.install = (app: App): void => {
   app.component(DropdownMenu.name, DropdownMenu)
 }
 
-export default DropdownMenu
+const _DropdownMenu: SFCWithInstall<typeof DropdownMenu> = DropdownMenu
+
+export default _DropdownMenu
diff --git a/packages/dropdown/index.ts b/packages/dropdown/index.ts
index 35f46b94fd45f..1b21587a8d698 100644
--- a/packages/dropdown/index.ts
+++ b/packages/dropdown/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import Dropdown from './src/dropdown.vue'
 
 Dropdown.install = (app: App): void => {
   app.component(Dropdown.name, Dropdown)
 }
 
-export default Dropdown
+const _Dropdown: SFCWithInstall<typeof Dropdown> = Dropdown
+
+export default _Dropdown
diff --git a/packages/footer/index.ts b/packages/footer/index.ts
index c863758880d0c..0b94da9d701b7 100644
--- a/packages/footer/index.ts
+++ b/packages/footer/index.ts
@@ -1,9 +1,12 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import Footer from '../container/src/footer.vue'
 
 Footer.install = (app: App): void => {
   app.component(Footer.name, Footer)
 }
 
-export default Footer
+const _Footer: SFCWithInstall<typeof Footer> = Footer
+
+export default _Footer
 
diff --git a/packages/form-item/index.ts b/packages/form-item/index.ts
index c6d377b65fb97..a372feb87e121 100644
--- a/packages/form-item/index.ts
+++ b/packages/form-item/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import FormItem from '../form/src/form-item.vue'
 
 FormItem.install = (app: App): void => {
   app.component(FormItem.name, FormItem)
 }
 
-export default FormItem
+const _FormItem: SFCWithInstall<typeof FormItem> = FormItem
+
+export default _FormItem
diff --git a/packages/form/index.ts b/packages/form/index.ts
index f0e330521594c..bf22266bb83f2 100644
--- a/packages/form/index.ts
+++ b/packages/form/index.ts
@@ -1,11 +1,14 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import Form from './src/form.vue'
 
 Form.install = (app: App): void => {
   app.component(Form.name, Form)
 }
 
-export default Form
+const _Form: SFCWithInstall<typeof Form> = Form
+
+export default _Form
 
 
 export * from './src/token'
diff --git a/packages/header/index.ts b/packages/header/index.ts
index 110a3d83a1a93..32585a8cc3c54 100644
--- a/packages/header/index.ts
+++ b/packages/header/index.ts
@@ -1,9 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import Header from '../container/src/header.vue'
 
 Header.install = (app: App): void => {
   app.component(Header.name, Header)
 }
+const _Header: SFCWithInstall<typeof Header> = Header
 
-export default Header
+export default _Header
 
diff --git a/packages/icon/index.ts b/packages/icon/index.ts
index 183c987884123..3ab58c2918b49 100644
--- a/packages/icon/index.ts
+++ b/packages/icon/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import Icon from './src/index.vue'
 
 Icon.install = (app: App): void => {
   app.component(Icon.name, Icon)
 }
 
-export default Icon
+const _Icon: SFCWithInstall<typeof Icon> = Icon
+
+export default _Icon
diff --git a/packages/image/index.ts b/packages/image/index.ts
index 578336056c713..99e38427f8e8c 100644
--- a/packages/image/index.ts
+++ b/packages/image/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import Image from './src/index.vue'
 
 Image.install = (app: App): void => {
   app.component(Image.name, Image)
 }
 
-export default Image
+const _Image: SFCWithInstall<typeof Image> = Image
+
+export default _Image
diff --git a/packages/input-number/index.ts b/packages/input-number/index.ts
index 76d5ec67d9930..798370c25b192 100644
--- a/packages/input-number/index.ts
+++ b/packages/input-number/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import InputNumber from './src/index.vue'
 
 InputNumber.install = (app: App): void => {
   app.component(InputNumber.name, InputNumber)
 }
 
-export default InputNumber
+const _InputNumber: SFCWithInstall<typeof InputNumber> = InputNumber
+
+export default _InputNumber
diff --git a/packages/input/index.ts b/packages/input/index.ts
index 3a21b5d346972..13f30935baeac 100644
--- a/packages/input/index.ts
+++ b/packages/input/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import Input from './src/index.vue'
 
 Input.install = (app: App): void => {
   app.component(Input.name, Input)
 }
 
-export default Input
+const _Input: SFCWithInstall<typeof Input> = Input
+
+export default _Input
diff --git a/packages/link/index.ts b/packages/link/index.ts
index dfcb21d1a45ad..52e385ed4043a 100644
--- a/packages/link/index.ts
+++ b/packages/link/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import Link from './src/index.vue'
 
 Link.install = (app: App): void => {
   app.component(Link.name, Link)
 }
 
-export default Link
+const _Link: SFCWithInstall<typeof Link> = Link
+
+export default _Link
diff --git a/packages/main/index.ts b/packages/main/index.ts
index 39216e7686149..cb21f4db1a9a8 100644
--- a/packages/main/index.ts
+++ b/packages/main/index.ts
@@ -1,9 +1,12 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import Main from '../container/src/main.vue'
 
 Main.install = (app: App): void => {
   app.component(Main.name, Main)
 }
 
-export default Main
+const _Main: SFCWithInstall<typeof Main> = Main
+
+export default _Main
 
diff --git a/packages/menu-item-group/index.ts b/packages/menu-item-group/index.ts
index 9756178c1cf53..a2a56f421c55c 100644
--- a/packages/menu-item-group/index.ts
+++ b/packages/menu-item-group/index.ts
@@ -1,9 +1,12 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import MenuItemGroup from '../menu/src/menuItemGroup.vue'
 
 MenuItemGroup.install = (app: App): void => {
   app.component(MenuItemGroup.name, MenuItemGroup)
 }
 
-export default MenuItemGroup
+const _MenuItemGroup: SFCWithInstall<typeof MenuItemGroup> = MenuItemGroup
+
+export default _MenuItemGroup
 
diff --git a/packages/menu-item/index.ts b/packages/menu-item/index.ts
index b57d54a6f29e4..f218711077180 100644
--- a/packages/menu-item/index.ts
+++ b/packages/menu-item/index.ts
@@ -1,9 +1,12 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import MenuItem from '../menu/src/menuItem.vue'
 
 MenuItem.install = (app: App): void => {
   app.component(MenuItem.name, MenuItem)
 }
 
-export default MenuItem
+const _MenuItem: SFCWithInstall<typeof MenuItem> = MenuItem
+
+export default _MenuItem
 
diff --git a/packages/menu/index.ts b/packages/menu/index.ts
index 234dfea6049a6..ac2ac2ed09917 100644
--- a/packages/menu/index.ts
+++ b/packages/menu/index.ts
@@ -1,9 +1,12 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import Menu from './src/menu.vue'
 
 Menu.install = (app: App): void => {
   app.component(Menu.name, Menu)
 }
 
-export default Menu
+const _Menu: SFCWithInstall<typeof Menu> = Menu
+
+export default _Menu
 
diff --git a/packages/option-group/index.ts b/packages/option-group/index.ts
index e6ae94ff91281..4cf41c441e3f6 100644
--- a/packages/option-group/index.ts
+++ b/packages/option-group/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import OptionGroup from '../select/src/option-group.vue'
 
 OptionGroup.install = (app: App): void => {
   app.component(OptionGroup.name, OptionGroup)
 }
 
-export default OptionGroup
+const _OptionGroup: SFCWithInstall<typeof OptionGroup> = OptionGroup
+
+export default _OptionGroup
diff --git a/packages/page-header/index.ts b/packages/page-header/index.ts
index c06bb9c52c4ee..f2f0ed93dcaf5 100644
--- a/packages/page-header/index.ts
+++ b/packages/page-header/index.ts
@@ -1,9 +1,12 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import PageHeader from './src/index.vue'
 
 PageHeader.install = (app: App): void => {
   app.component(PageHeader.name, PageHeader)
 }
 
-export default PageHeader
+const _PageHeader: SFCWithInstall<typeof PageHeader> = PageHeader
+
+export default _PageHeader
 
diff --git a/packages/popconfirm/index.ts b/packages/popconfirm/index.ts
index 54eca884b6f44..27944fe35be4d 100644
--- a/packages/popconfirm/index.ts
+++ b/packages/popconfirm/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import Popconfirm from './src/index.vue'
 
 Popconfirm.install = (app: App): void => {
   app.component(Popconfirm.name, Popconfirm)
 }
 
-export default Popconfirm
+const _Popconfirm: SFCWithInstall<typeof Popconfirm> = Popconfirm
+
+export default _Popconfirm
diff --git a/packages/popover/index.ts b/packages/popover/index.ts
index 954f4338a7081..4f4afac575cde 100644
--- a/packages/popover/index.ts
+++ b/packages/popover/index.ts
@@ -1,4 +1,5 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import Popover from './src/index.vue'
 import PopoverDirective, { VPopover } from './src/directive'
 
@@ -7,4 +8,7 @@ Popover.install = (app: App): void => {
   app.directive(VPopover, PopoverDirective)
 }
 Popover.directive = PopoverDirective
-export default Popover
+
+const _Popover: SFCWithInstall<typeof Popover> = Popover
+
+export default _Popover
diff --git a/packages/popper/index.ts b/packages/popper/index.ts
index 9e1b53f8a34ae..df9b7ccf6e0a2 100644
--- a/packages/popper/index.ts
+++ b/packages/popper/index.ts
@@ -1,11 +1,14 @@
 import type { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import Popper from './src/index.vue'
 
 Popper.install = (app: App): void => {
   app.component(Popper.name, Popper)
 }
 
-export default Popper
+const _Popper: SFCWithInstall<typeof Popper> = Popper
+
+export default _Popper
 
 export { default as defaultProps, Effect, Placement, Options } from './src/use-popper/defaults'
 export type { TriggerType, IPopperOptions, PopperInstance } from './src/use-popper/defaults'
diff --git a/packages/progress/index.ts b/packages/progress/index.ts
index 58ac4bac600bf..314fe94d0c358 100644
--- a/packages/progress/index.ts
+++ b/packages/progress/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import Progress from './src/index.vue'
 
 Progress.install = (app: App): void => {
   app.component(Progress.name, Progress)
 }
 
-export default Progress
+const _Progress: SFCWithInstall<typeof Progress> = Progress
+
+export default _Progress
diff --git a/packages/radio-button/index.ts b/packages/radio-button/index.ts
index 34018015fa575..c5f0c65495ab9 100644
--- a/packages/radio-button/index.ts
+++ b/packages/radio-button/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import RadioButton from '../radio/src/radio-button.vue'
 
 RadioButton.install = (app: App): void => {
   app.component(RadioButton.name, RadioButton)
 }
 
-export default RadioButton
+const _RadioButton: SFCWithInstall<typeof RadioButton> = RadioButton
+
+export default _RadioButton
diff --git a/packages/radio-group/index.ts b/packages/radio-group/index.ts
index d47e4e11f6729..5849ea41ecf30 100644
--- a/packages/radio-group/index.ts
+++ b/packages/radio-group/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import RadioGroup from '../radio/src/radio-group.vue'
 
 RadioGroup.install = (app: App): void => {
   app.component(RadioGroup.name, RadioGroup)
 }
 
-export default RadioGroup
+const _RadioGroup: SFCWithInstall<typeof RadioGroup> = RadioGroup
+
+export default _RadioGroup
diff --git a/packages/radio/index.ts b/packages/radio/index.ts
index 1b6067bf2ab26..f2d7abfcb93ff 100644
--- a/packages/radio/index.ts
+++ b/packages/radio/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import Radio from './src/radio.vue'
 
 Radio.install = (app: App): void => {
   app.component(Radio.name, Radio)
 }
 
-export default Radio
+const _Radio: SFCWithInstall<typeof Radio> = Radio
+
+export default _Radio
diff --git a/packages/rate/index.ts b/packages/rate/index.ts
index c3715cb86a2dd..823173aaa6225 100644
--- a/packages/rate/index.ts
+++ b/packages/rate/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import Rate from './src/index.vue'
 
 Rate.install = (app: App): void => {
   app.component(Rate.name, Rate)
 }
 
-export default Rate
+const _Rate: SFCWithInstall<typeof Rate> = Rate
+
+export default _Rate
diff --git a/packages/scrollbar/index.ts b/packages/scrollbar/index.ts
index 4c57c6c11474d..d3f5fc69b9513 100644
--- a/packages/scrollbar/index.ts
+++ b/packages/scrollbar/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import Scrollbar from './src/index.vue'
 
 Scrollbar.install = (app: App): void => {
   app.component(Scrollbar.name, Scrollbar)
 }
 
-export default Scrollbar
+const _Scrollbar: SFCWithInstall<typeof Scrollbar> = Scrollbar
+
+export default _Scrollbar
diff --git a/packages/select/index.ts b/packages/select/index.ts
index 977cff922c09f..09bb423a7fef2 100644
--- a/packages/select/index.ts
+++ b/packages/select/index.ts
@@ -1,4 +1,5 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import Select from './src/select.vue'
 import Option from './src/option.vue'
 
@@ -6,5 +7,7 @@ Select.install = (app: App): void => {
   app.component(Select.name, Select)
 }
 
+const _Select: SFCWithInstall<typeof Select> = Select
+
 export { Option }
-export default Select
+export default _Select
diff --git a/packages/slider/index.ts b/packages/slider/index.ts
index 49ad0a8a3058b..060b34ada5ad7 100644
--- a/packages/slider/index.ts
+++ b/packages/slider/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import Slider from './src/index.vue'
 
 Slider.install = (app: App): void => {
   app.component(Slider.name, Slider)
 }
 
-export default Slider
+const _Slider: SFCWithInstall<typeof Slider> = Slider
+
+export default _Slider
diff --git a/packages/step/index.ts b/packages/step/index.ts
index 1b652b45c2a98..d3b2c0e8e6ed6 100644
--- a/packages/step/index.ts
+++ b/packages/step/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import Step from '../steps/src/item.vue'
 
 Step.install = (app: App): void => {
   app.component(Step.name, Step)
 }
 
-export default Step
+const _Step: SFCWithInstall<typeof Step> = Step
+
+export default _Step
diff --git a/packages/steps/index.ts b/packages/steps/index.ts
index 157589ca87631..b62481c5752f0 100644
--- a/packages/steps/index.ts
+++ b/packages/steps/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import Steps from './src/index.vue'
 
 Steps.install = (app: App): void => {
   app.component(Steps.name, Steps)
 }
 
-export default Steps
+const _Steps: SFCWithInstall<typeof Steps> = Steps
+
+export default _Steps
diff --git a/packages/submenu/index.ts b/packages/submenu/index.ts
index 3cae1f7cdad31..1088a70adbed6 100644
--- a/packages/submenu/index.ts
+++ b/packages/submenu/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import Submenu from '../menu/src/submenu.vue'
 
 Submenu.install = (app: App): void => {
   app.component(Submenu.name, Submenu)
 }
 
-export default Submenu
+const _Submenu: SFCWithInstall<typeof Submenu> = Submenu
+
+export default _Submenu
diff --git a/packages/switch/index.ts b/packages/switch/index.ts
index a8a65be4d7366..4c17fcaf58eba 100644
--- a/packages/switch/index.ts
+++ b/packages/switch/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import Switch from './src/index.vue'
 
 Switch.install = (app: App): void => {
   app.component(Switch.name, Switch)
 }
 
-export default Switch
+const _Switch: SFCWithInstall<typeof Switch> = Switch
+
+export default _Switch
diff --git a/packages/tab-pane/index.ts b/packages/tab-pane/index.ts
index 300e6402691dc..fa502395edef8 100644
--- a/packages/tab-pane/index.ts
+++ b/packages/tab-pane/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import TabPane from '../tabs/src/tab-pane.vue'
 
 TabPane.install = (app: App): void => {
   app.component(TabPane.name, TabPane)
 }
 
-export default TabPane
+const _TabPane: SFCWithInstall<typeof TabPane> = TabPane
+
+export default _TabPane
diff --git a/packages/table/index.ts b/packages/table/index.ts
index 811d807b27e9d..d493e84e90986 100644
--- a/packages/table/index.ts
+++ b/packages/table/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import Table from './src/table.vue'
 
 Table.install = (app: App): void => {
   app.component(Table.name, Table)
 }
 
-export default Table
+const _Table: SFCWithInstall<typeof Table> = Table
+
+export default _Table
diff --git a/packages/tabs/index.ts b/packages/tabs/index.ts
index b7cf3d7948a70..b529387d23be0 100644
--- a/packages/tabs/index.ts
+++ b/packages/tabs/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import Tabs from './src/tabs.vue'
 
 Tabs.install = (app: App): void => {
   app.component(Tabs.name, Tabs)
 }
 
-export default Tabs
+const _Tabs: SFCWithInstall<typeof Tabs> = Tabs
+
+export default _Tabs
diff --git a/packages/tag/index.ts b/packages/tag/index.ts
index c338bb5dd077e..f17958ed1e62a 100644
--- a/packages/tag/index.ts
+++ b/packages/tag/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import Tag from './src/index.vue'
 
 Tag.install = (app: App): void => {
   app.component(Tag.name, Tag)
 }
 
-export default Tag
+const _Tag: SFCWithInstall<typeof Tag> = Tag
+
+export default _Tag
diff --git a/packages/time-select/index.ts b/packages/time-select/index.ts
index 35106c337c545..8d3023fc23619 100644
--- a/packages/time-select/index.ts
+++ b/packages/time-select/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import TimeSelect from './src/time-select.vue'
 
 TimeSelect.install = (app: App): void => {
   app.component(TimeSelect.name, TimeSelect)
 }
 
-export default TimeSelect
+const _TimeSelect: SFCWithInstall<typeof TimeSelect> = TimeSelect
+
+export default _TimeSelect
diff --git a/packages/timeline-item/index.ts b/packages/timeline-item/index.ts
index 0916c35701971..1680c0fc0a6a3 100644
--- a/packages/timeline-item/index.ts
+++ b/packages/timeline-item/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import TimelineItem from '../timeline/src/item.vue'
 
 TimelineItem.install = (app: App): void => {
   app.component(TimelineItem.name, TimelineItem)
 }
 
-export default TimelineItem
+const _TimelineItem: SFCWithInstall<typeof TimelineItem> = TimelineItem
+
+export default _TimelineItem
diff --git a/packages/timeline/index.ts b/packages/timeline/index.ts
index da063b2013253..fcb3ffdbf80b0 100644
--- a/packages/timeline/index.ts
+++ b/packages/timeline/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import Timeline from './src/index.vue'
 
 Timeline.install = (app: App): void => {
   app.component(Timeline.name, Timeline)
 }
 
-export default Timeline
+const _Timeline: SFCWithInstall<typeof Timeline> = Timeline
+
+export default _Timeline
diff --git a/packages/transfer/index.ts b/packages/transfer/index.ts
index 63e187ada05cb..da282801d8506 100644
--- a/packages/transfer/index.ts
+++ b/packages/transfer/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import Transfer from './src/index.vue'
 
 Transfer.install = (app: App): void => {
   app.component(Transfer.name, Transfer)
 }
 
-export default Transfer
+const _Transfer: SFCWithInstall<typeof Transfer> = Transfer
+
+export default _Transfer
diff --git a/packages/transition/index.ts b/packages/transition/index.ts
index 4b22209196739..6a3ca9087ad44 100644
--- a/packages/transition/index.ts
+++ b/packages/transition/index.ts
@@ -5,4 +5,5 @@ export default (app: App): void => {
   app.component(ElCollapseTransition.name, ElCollapseTransition)
 }
 
+
 export { ElCollapseTransition }
diff --git a/packages/tree/index.ts b/packages/tree/index.ts
index 1c11a7d4848ed..31119e1111bf8 100644
--- a/packages/tree/index.ts
+++ b/packages/tree/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import Tree from './src/tree.vue'
 
 Tree.install = (app: App): void => {
   app.component(Tree.name, Tree)
 }
 
-export default Tree
+const _Tree: SFCWithInstall<typeof Tree> = Tree
+
+export default _Tree
diff --git a/packages/upload/index.ts b/packages/upload/index.ts
index 7d253ddfbec71..b2e5dbffc61df 100644
--- a/packages/upload/index.ts
+++ b/packages/upload/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import Upload from './src/index.vue'
 
 Upload.install = (app: App): void => {
   app.component(Upload.name, Upload)
 }
 
-export default Upload
+const _Upload: SFCWithInstall<typeof Upload> = Upload
+
+export default _Upload
diff --git a/packages/utils/types.ts b/packages/utils/types.ts
index 52974021eafc9..1d2d35ba84413 100644
--- a/packages/utils/types.ts
+++ b/packages/utils/types.ts
@@ -1,3 +1,5 @@
+import { App } from 'vue'
+
 type OptionalKeys<T extends Record<string, unknown>> = {
   [K in keyof T]: T extends Record<K, T[K]>
     ? never
@@ -16,3 +18,5 @@ export type EventEmitter<T extends Record<string, unknown>> =
 export type AnyFunction<T> = (...args: any[]) => T
 
 export type PartialReturnType<T extends (...args: unknown[]) =>  unknown> = Partial<ReturnType<T>>
+
+export type SFCWithInstall<T> = T & { install(app: App): void; }
diff --git a/packages/virtual-list/index.ts b/packages/virtual-list/index.ts
index d15125dbeb6f6..7fe2d4fc79b7f 100644
--- a/packages/virtual-list/index.ts
+++ b/packages/virtual-list/index.ts
@@ -1,8 +1,11 @@
 import { App } from 'vue'
+import type { SFCWithInstall } from '@element-plus/utils/types'
 import VirtualList from './src/index.vue'
 
 VirtualList.install = (app: App): void => {
   app.component(VirtualList.name, VirtualList)
 }
 
-export default VirtualList
+const _VirtualList: SFCWithInstall<typeof VirtualList> = VirtualList
+
+export default _VirtualList
diff --git a/typings/vue-shim.d.ts b/typings/vue-shim.d.ts
index 522995d1f3aae..fe6835a09f462 100644
--- a/typings/vue-shim.d.ts
+++ b/typings/vue-shim.d.ts
@@ -1,6 +1,8 @@
 declare module '*.vue' {
-  import { defineComponent } from 'vue'
-  const component: ReturnType<typeof defineComponent>
+  import { App, defineComponent } from 'vue'
+  const component: ReturnType<typeof defineComponent> & {
+    install(app: App): void
+  }
   export default component
 }