diff --git a/packages/varlet-ui/src/action-sheet/ActionSheet.vue b/packages/varlet-ui/src/action-sheet/ActionSheet.vue
index 807171d8a9c..502bbe8857c 100644
--- a/packages/varlet-ui/src/action-sheet/ActionSheet.vue
+++ b/packages/varlet-ui/src/action-sheet/ActionSheet.vue
@@ -51,11 +51,12 @@
 import Ripple from '../ripple'
 import Popup from '../popup'
 import Icon from '../icon'
-import { defineComponent, ref, Ref, watch } from 'vue'
+import { defineComponent, ref, watch } from 'vue'
 import { props } from './props'
 import { dt } from '../utils/shared'
 import { pack } from '../locale'
-import { ActionItem } from './index'
+import type { Ref } from 'vue'
+import type { ActionItem } from './index'
 
 export default defineComponent({
   name: 'VarActionSheet',
diff --git a/packages/varlet-ui/src/back-top/BackTop.vue b/packages/varlet-ui/src/back-top/BackTop.vue
index fb2c29daf11..a51a6e05c85 100644
--- a/packages/varlet-ui/src/back-top/BackTop.vue
+++ b/packages/varlet-ui/src/back-top/BackTop.vue
@@ -8,12 +8,13 @@
   </div>
 </template>
 <script lang="ts">
-import { defineComponent, ref, Ref, onMounted, onBeforeUnmount } from 'vue'
+import { defineComponent, ref, onMounted, onBeforeUnmount } from 'vue'
 import Button from '../button'
 import Icon from '../icon'
 import { props } from './props'
 import { isString, easeInOutCubic, throttle, toNumber } from '../utils/shared'
 import { getScrollTop, getScrollLeft, scrollTo } from '../utils/elements'
+import type { Ref } from 'vue'
 
 export default defineComponent({
   name: 'VarBackTop',
diff --git a/packages/varlet-ui/src/badge/Badge.vue b/packages/varlet-ui/src/badge/Badge.vue
index 47fb15c500d..6aa7c9de3e9 100644
--- a/packages/varlet-ui/src/badge/Badge.vue
+++ b/packages/varlet-ui/src/badge/Badge.vue
@@ -17,10 +17,11 @@
 </template>
 
 <script lang="ts">
-import { computed, ComputedRef, defineComponent } from 'vue'
+import { computed, defineComponent } from 'vue'
 import { props } from './props'
 import Icon from '../icon'
 import { toNumber } from '../utils/shared'
+import type { ComputedRef } from 'vue'
 
 export default defineComponent({
   name: 'VarBadge',
diff --git a/packages/varlet-ui/src/checkbox-group/CheckboxGroup.vue b/packages/varlet-ui/src/checkbox-group/CheckboxGroup.vue
index 32a380d8eed..9be645e0b14 100644
--- a/packages/varlet-ui/src/checkbox-group/CheckboxGroup.vue
+++ b/packages/varlet-ui/src/checkbox-group/CheckboxGroup.vue
@@ -9,12 +9,15 @@
 
 <script lang="ts">
 import FormDetails from '../form-details'
-import { defineComponent, computed, ComputedRef, watch, nextTick } from 'vue'
-import { props, ValidateTriggers } from './props'
+import { defineComponent, computed, watch, nextTick } from 'vue'
+import { props } from './props'
 import { useValidation } from '../utils/components'
-import { CheckboxGroupProvider, useCheckboxes } from './provide'
+import { useCheckboxes } from './provide'
 import { useForm } from '../form/provide'
 import { uniq } from '../utils/shared'
+import type { ComputedRef } from 'vue'
+import type { ValidateTriggers } from './props'
+import type { CheckboxGroupProvider } from './provide'
 
 export default defineComponent({
   name: 'VarCheckboxGroup',
diff --git a/packages/varlet-ui/src/checkbox/Checkbox.vue b/packages/varlet-ui/src/checkbox/Checkbox.vue
index 1b924ac4108..c479a24b559 100644
--- a/packages/varlet-ui/src/checkbox/Checkbox.vue
+++ b/packages/varlet-ui/src/checkbox/Checkbox.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="var-checkbox__wrap" @click="handleClick" v-bind="$attrs">
+  <div class="var-checkbox__wrap" @click="handleClick">
     <div class="var-checkbox">
       <div
         class="var-checkbox__action"
@@ -50,11 +50,14 @@
 import Icon from '../icon'
 import Ripple from '../ripple'
 import FormDetails from '../form-details'
-import { defineComponent, ref, Ref, computed, ComputedRef, watch, nextTick } from 'vue'
-import { props, ValidateTriggers } from './props'
+import { defineComponent, ref, computed, watch, nextTick } from 'vue'
+import { props } from './props'
 import { useValidation } from '../utils/components'
-import { CheckboxProvider, useCheckboxGroup } from './provide'
+import { useCheckboxGroup } from './provide'
 import { useForm } from '../form/provide'
+import type { Ref, ComputedRef } from 'vue'
+import type { ValidateTriggers } from './props'
+import type { CheckboxProvider } from './provide'
 
 export default defineComponent({
   name: 'VarCheckbox',
@@ -63,7 +66,6 @@ export default defineComponent({
     [Icon.name]: Icon,
     [FormDetails.name]: FormDetails,
   },
-  inheritAttrs: false,
   props,
   setup(props) {
     const value: Ref<any> = ref(false)
diff --git a/packages/varlet-ui/src/chip/Chip.vue b/packages/varlet-ui/src/chip/Chip.vue
index cf1b6faa9f9..90df1b94e09 100644
--- a/packages/varlet-ui/src/chip/Chip.vue
+++ b/packages/varlet-ui/src/chip/Chip.vue
@@ -18,8 +18,9 @@
 
 <script lang="ts">
 import Icon from '../icon'
-import { defineComponent, computed, ComputedRef } from 'vue'
+import { defineComponent, computed } from 'vue'
 import { props } from './props'
+import type { ComputedRef } from 'vue'
 
 export default defineComponent({
   name: 'VarChip',
diff --git a/packages/varlet-ui/src/col/Col.vue b/packages/varlet-ui/src/col/Col.vue
index bfaf30abfbf..65eef57bfd0 100644
--- a/packages/varlet-ui/src/col/Col.vue
+++ b/packages/varlet-ui/src/col/Col.vue
@@ -9,7 +9,6 @@
       paddingLeft: toSizeUnit(padding.left),
       paddingRight: toSizeUnit(padding.right)
     }"
-    v-bind="$attrs"
     @click="onClick"
   >
     <slot />
@@ -17,15 +16,16 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, ref, Ref, computed, ComputedRef, watch } from 'vue'
+import { defineComponent, ref, computed, watch } from 'vue'
 import { toNumber } from '../utils/shared'
 import { props } from './props'
-import { ColPadding, ColProvider, useRow } from './provide'
+import { useRow } from './provide'
 import { toSizeUnit } from '../utils/elements'
+import type { Ref, ComputedRef } from 'vue'
+import type { ColPadding, ColProvider } from './provide'
 
 export default defineComponent({
   name: 'VarCol',
-  inheritAttrs: false,
   props,
   setup(props) {
     const padding: Ref<ColPadding> = ref({ left: 0, right: 0 })
@@ -51,7 +51,7 @@ export default defineComponent({
     return {
       padding,
       toNumber,
-      toSizeUnit,
+      toSizeUnit
     }
   }
 })
diff --git a/packages/varlet-ui/src/collapse-item/CollapseItem.vue b/packages/varlet-ui/src/collapse-item/CollapseItem.vue
index 4ecfb709d76..70654bbdc55 100644
--- a/packages/varlet-ui/src/collapse-item/CollapseItem.vue
+++ b/packages/varlet-ui/src/collapse-item/CollapseItem.vue
@@ -33,12 +33,14 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, ref, Ref, nextTick, watch, ComputedRef, computed } from 'vue'
+import { defineComponent, ref, nextTick, watch, computed } from 'vue'
 import { requestAnimationFrame } from '../utils/elements'
 import { isArray } from '../utils/shared'
-import { CollapseItemProvider, useCollapse } from './provide'
+import { useCollapse } from './provide'
 import { props } from './props'
 import Icon from '../icon'
+import type { Ref, ComputedRef } from 'vue'
+import type { CollapseItemProvider } from './provide'
 
 export default defineComponent({
   name: 'VarCollapseItem',
diff --git a/packages/varlet-ui/src/collapse/Collapse.vue b/packages/varlet-ui/src/collapse/Collapse.vue
index db24cfdd2e6..fda21b1326e 100644
--- a/packages/varlet-ui/src/collapse/Collapse.vue
+++ b/packages/varlet-ui/src/collapse/Collapse.vue
@@ -5,11 +5,13 @@
 </template>
 
 <script lang="ts">
-import { computed, ComputedRef, defineComponent, nextTick, watch } from 'vue'
-import { CollapseProvider, useCollapseItem } from './provide'
-import { CollapseItemProvider } from '../collapse-item/provide'
+import { computed, defineComponent, nextTick, watch } from 'vue'
+import { useCollapseItem } from './provide'
 import { props } from './props'
 import { isArray } from '../utils/shared'
+import type { ComputedRef } from 'vue'
+import type { CollapseItemProvider } from '../collapse-item/provide'
+import type { CollapseProvider } from './provide'
 
 export default defineComponent({
   name: 'VarCollapse',
diff --git a/packages/varlet-ui/src/context/lock.ts b/packages/varlet-ui/src/context/lock.ts
index 5b78f77ce89..84f759f33f6 100644
--- a/packages/varlet-ui/src/context/lock.ts
+++ b/packages/varlet-ui/src/context/lock.ts
@@ -4,9 +4,9 @@ import {
   onUnmounted,
   onDeactivated,
   onActivated,
-  getCurrentInstance,
-  ComponentInternalInstance
+  getCurrentInstance
 } from 'vue'
+import type { ComponentInternalInstance } from 'vue'
 import context from '.'
 
 export function resolveLock() {
diff --git a/packages/varlet-ui/src/countdown/Countdown.vue b/packages/varlet-ui/src/countdown/Countdown.vue
index fd24d3d4d0a..e63c13fecc3 100644
--- a/packages/varlet-ui/src/countdown/Countdown.vue
+++ b/packages/varlet-ui/src/countdown/Countdown.vue
@@ -7,10 +7,12 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, Ref, ref, watch } from 'vue'
+import { defineComponent, ref, watch } from 'vue'
 import { props } from './props'
 import { requestAnimationFrame, cancelAnimationFrame } from '../utils/elements'
-import { toNumber, parseFormat, Time } from '../utils/shared'
+import { toNumber, parseFormat } from '../utils/shared'
+import type { Ref } from 'vue'
+import type { Time } from '../utils/shared'
 
 const SECOND = 1000
 const MINUTE = 60 * SECOND
diff --git a/packages/varlet-ui/src/counter/Counter.vue b/packages/varlet-ui/src/counter/Counter.vue
index 656cfbc0bfc..9a78e41104f 100644
--- a/packages/varlet-ui/src/counter/Counter.vue
+++ b/packages/varlet-ui/src/counter/Counter.vue
@@ -62,14 +62,16 @@
 import Icon from '../icon'
 import Ripple from '../ripple'
 import FormDetails from '../form-details'
-import { defineComponent, ref, Ref, watch, computed, ComputedRef, nextTick } from 'vue'
+import { defineComponent, ref, watch, computed, nextTick } from 'vue'
 import { Decimal } from 'decimal.js'
-import { props, ValidateTriggers } from './props'
+import { props } from './props'
 import { toNumber } from '../utils/shared'
 import { toSizeUnit } from '../utils/elements'
-import { CounterProvider } from './provide'
 import { useForm } from '../form/provide'
 import { useValidation } from '../utils/components'
+import type { Ref, ComputedRef } from 'vue'
+import type { ValidateTriggers } from './props'
+import type { CounterProvider } from './provide'
 
 const SPEED = 100
 const DELAY = 600
diff --git a/packages/varlet-ui/src/date-picker/DatePicker.vue b/packages/varlet-ui/src/date-picker/DatePicker.vue
index 0a4962b105a..4517ec8b468 100644
--- a/packages/varlet-ui/src/date-picker/DatePicker.vue
+++ b/packages/varlet-ui/src/date-picker/DatePicker.vue
@@ -81,14 +81,16 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, Ref, ref, computed, ComputedRef, reactive, UnwrapRef, watch } from 'vue'
+import { defineComponent, ref, computed, reactive, watch } from 'vue'
 import dayjs from 'dayjs'
 import MonthPickerPanel from './src/month-picker-panel.vue'
 import YearPickerPanel from './src/year-picker-panel.vue'
 import DayPickerPanel from './src/day-picker-panel.vue'
-import { props, Month, MONTH_LIST, Choose, Preview, WEEK_HEADER, Week, ComponentProps } from './props'
+import { props, MONTH_LIST, WEEK_HEADER } from './props'
 import { isArray, toNumber } from '../utils/shared'
 import { pack } from '../locale'
+import type { Ref, ComputedRef, UnwrapRef } from 'vue'
+import type { Month, Choose, Preview, Week, ComponentProps } from './props'
 
 export default defineComponent({
   name: 'VarDatePicker',
diff --git a/packages/varlet-ui/src/date-picker/src/day-picker-panel.vue b/packages/varlet-ui/src/date-picker/src/day-picker-panel.vue
index ad9b166091c..a4a1cbd65c8 100644
--- a/packages/varlet-ui/src/date-picker/src/day-picker-panel.vue
+++ b/packages/varlet-ui/src/date-picker/src/day-picker-panel.vue
@@ -40,15 +40,17 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, Ref, ref, PropType, computed, ComputedRef, watch, onMounted, UnwrapRef, reactive } from 'vue'
+import { defineComponent, ref, computed, watch, onMounted, reactive } from 'vue'
 import dayjs from 'dayjs'
 import isSameOrBefore from 'dayjs/plugin/isSameOrBefore'
 import isSameOrAfter from 'dayjs/plugin/isSameOrAfter'
 import PanelHeader from './panel-header.vue'
 import Button from '../../button'
-import { WEEK_HEADER, Choose, Preview, ComponentProps, Week, PanelBtnDisabled } from '../props'
+import { WEEK_HEADER } from '../props'
 import { toNumber } from '../../utils/shared'
 import { pack } from '../../locale'
+import type { Ref, ComputedRef, UnwrapRef, PropType } from 'vue'
+import type { Choose, Preview, ComponentProps, Week, PanelBtnDisabled } from '../props'
 
 dayjs.extend(isSameOrBefore)
 dayjs.extend(isSameOrAfter)
diff --git a/packages/varlet-ui/src/date-picker/src/month-picker-panel.vue b/packages/varlet-ui/src/date-picker/src/month-picker-panel.vue
index 8386908bd4a..fc1df37211b 100644
--- a/packages/varlet-ui/src/date-picker/src/month-picker-panel.vue
+++ b/packages/varlet-ui/src/date-picker/src/month-picker-panel.vue
@@ -31,15 +31,17 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, Ref, ref, PropType, computed, ComputedRef, reactive, watch, UnwrapRef } from 'vue'
+import { defineComponent, ref, computed, reactive, watch } from 'vue'
 import dayjs from 'dayjs'
 import isSameOrBefore from 'dayjs/plugin/isSameOrBefore'
 import isSameOrAfter from 'dayjs/plugin/isSameOrAfter'
-import { MONTH_LIST, Choose, Month, Preview, ComponentProps, PanelBtnDisabled } from '../props'
+import { MONTH_LIST } from '../props'
 import PanelHeader from './panel-header.vue'
 import Button from '../../button'
 import { toNumber } from '../../utils/shared'
 import { pack } from '../../locale'
+import type { Ref, ComputedRef, UnwrapRef, PropType } from 'vue'
+import type { Choose, Preview, ComponentProps, Month, PanelBtnDisabled } from '../props'
 
 dayjs.extend(isSameOrBefore)
 dayjs.extend(isSameOrAfter)
diff --git a/packages/varlet-ui/src/date-picker/src/panel-header.vue b/packages/varlet-ui/src/date-picker/src/panel-header.vue
index 4dca2543404..84d85a63ed0 100644
--- a/packages/varlet-ui/src/date-picker/src/panel-header.vue
+++ b/packages/varlet-ui/src/date-picker/src/panel-header.vue
@@ -27,12 +27,13 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, Ref, ref, computed, ComputedRef, watch, PropType } from 'vue'
+import { defineComponent, ref, computed, watch } from 'vue'
 import Button from '../../button'
 import Icon from '../../icon'
-import { Preview, PanelBtnDisabled } from '../props'
 import { toNumber } from '../../utils/shared'
 import { pack } from '../../locale'
+import type { Ref, ComputedRef, PropType } from 'vue'
+import type { Preview, PanelBtnDisabled } from '../props'
 
 export default defineComponent({
   name: 'PanelHeader',
diff --git a/packages/varlet-ui/src/date-picker/src/year-picker-panel.vue b/packages/varlet-ui/src/date-picker/src/year-picker-panel.vue
index 44f92019d9f..c1ee091e952 100644
--- a/packages/varlet-ui/src/date-picker/src/year-picker-panel.vue
+++ b/packages/varlet-ui/src/date-picker/src/year-picker-panel.vue
@@ -13,10 +13,11 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, computed, ComputedRef, onMounted, PropType } from 'vue'
+import { defineComponent, computed, onMounted } from 'vue'
 import dayjs from 'dayjs'
-import { ComponentProps } from '../props'
 import { toNumber } from '../../utils/shared'
+import type { ComputedRef, PropType } from 'vue'
+import type { ComponentProps } from '../props'
 
 export default defineComponent({
   name: 'YearPickerPanel',
diff --git a/packages/varlet-ui/src/dialog/Dialog.vue b/packages/varlet-ui/src/dialog/Dialog.vue
index 8a57d2afcfe..93d42a382ee 100644
--- a/packages/varlet-ui/src/dialog/Dialog.vue
+++ b/packages/varlet-ui/src/dialog/Dialog.vue
@@ -57,9 +57,10 @@
 import Popup from '../popup'
 import Button from '../button'
 import { props } from './props'
-import { defineComponent, ref, Ref, watch } from 'vue'
+import { defineComponent, ref, watch } from 'vue'
 import { dt } from '../utils/shared'
 import { pack } from '../locale'
+import type { Ref } from 'vue'
 
 export default defineComponent({
   name: 'VarDialog',
diff --git a/packages/varlet-ui/src/form/Form.vue b/packages/varlet-ui/src/form/Form.vue
index 3672621f23f..0fcdc34f87d 100644
--- a/packages/varlet-ui/src/form/Form.vue
+++ b/packages/varlet-ui/src/form/Form.vue
@@ -5,9 +5,11 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, computed, ComputedRef } from 'vue'
+import { defineComponent, computed } from 'vue'
 import { props } from './props'
-import { FormProvider, useFormItems } from './provide'
+import { useFormItems } from './provide'
+import type { ComputedRef } from 'vue'
+import type { FormProvider } from './provide'
 
 export default defineComponent({
   name: 'VarForm',
diff --git a/packages/varlet-ui/src/icon/Icon.vue b/packages/varlet-ui/src/icon/Icon.vue
index 5814c9b5f80..98a1ac27bcc 100644
--- a/packages/varlet-ui/src/icon/Icon.vue
+++ b/packages/varlet-ui/src/icon/Icon.vue
@@ -21,10 +21,11 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, watch, ref, Ref, nextTick } from 'vue'
+import { defineComponent, watch, ref, nextTick } from 'vue'
 import { isURL, toNumber } from '../utils/shared'
 import { props } from './props'
 import { toSizeUnit } from '../utils/elements'
+import type { Ref } from 'vue'
 
 export default defineComponent({
   name: 'VarIcon',
diff --git a/packages/varlet-ui/src/image-preview/ImagePreview.vue b/packages/varlet-ui/src/image-preview/ImagePreview.vue
index 9cf03baf8ad..39bc84738ef 100644
--- a/packages/varlet-ui/src/image-preview/ImagePreview.vue
+++ b/packages/varlet-ui/src/image-preview/ImagePreview.vue
@@ -73,9 +73,10 @@ import Swipe from '../swipe'
 import SwipeItem from '../swipe-item'
 import Icon from '../icon'
 import Popup from '../popup'
-import { defineComponent, ref, computed, Ref, ComputedRef, watch } from 'vue'
+import { defineComponent, ref, computed, watch } from 'vue'
 import { props } from './props'
 import { toNumber } from '../utils/shared'
+import type { Ref, ComputedRef } from 'vue'
 
 type VarTouch = {
   clientX: number
diff --git a/packages/varlet-ui/src/image/Image.vue b/packages/varlet-ui/src/image/Image.vue
index bd3fd67b3d4..49846ebc675 100644
--- a/packages/varlet-ui/src/image/Image.vue
+++ b/packages/varlet-ui/src/image/Image.vue
@@ -37,10 +37,11 @@
 
 <script lang="ts">
 import Ripple from '../ripple'
-import Lazy, { LazyHTMLElement } from '../lazy'
+import Lazy from '../lazy'
 import { defineComponent } from 'vue'
 import { props } from './props'
 import { toSizeUnit } from '../utils/elements'
+import type { LazyHTMLElement } from '../lazy'
 
 export default defineComponent({
   name: 'VarImage',
diff --git a/packages/varlet-ui/src/index-anchor/IndexAnchor.vue b/packages/varlet-ui/src/index-anchor/IndexAnchor.vue
index 27ca1b0e0ef..2ac9e6870d0 100644
--- a/packages/varlet-ui/src/index-anchor/IndexAnchor.vue
+++ b/packages/varlet-ui/src/index-anchor/IndexAnchor.vue
@@ -12,10 +12,12 @@
 </template>
 
 <script lang="ts">
-import { computed, ComputedRef, defineComponent, ref, Ref, RendererNode, Transition } from 'vue'
+import { computed, defineComponent, ref, RendererNode, Transition } from 'vue'
 import Sticky from '../sticky'
-import { IndexAnchorProvider, useIndexBar } from './provide'
+import { useIndexBar } from './provide'
 import { props } from './props'
+import type { Ref, ComputedRef } from 'vue'
+import type { IndexAnchorProvider } from './provide'
 
 export default defineComponent({
   name: 'VarIndexAnchor',
diff --git a/packages/varlet-ui/src/index-bar/IndexBar.vue b/packages/varlet-ui/src/index-bar/IndexBar.vue
index 926c5bf1e1a..bde631b80f7 100644
--- a/packages/varlet-ui/src/index-bar/IndexBar.vue
+++ b/packages/varlet-ui/src/index-bar/IndexBar.vue
@@ -17,12 +17,14 @@
 </template>
 
 <script lang="ts">
-import { computed, ComputedRef, defineComponent, nextTick, ref, Ref, watch, onMounted, onBeforeUnmount } from 'vue'
+import { computed, defineComponent, nextTick, ref, watch, onMounted, onBeforeUnmount } from 'vue'
 import { isPlainObject } from '../utils/shared'
 import { getParentScroller, requestAnimationFrame } from '../utils/elements'
-import { IndexBarProvider, useIndexAnchors } from './provide'
-import { IndexAnchorProvider } from '../index-anchor/provide'
+import { useIndexAnchors } from './provide'
 import { props } from './props'
+import type { Ref, ComputedRef } from 'vue'
+import type { IndexBarProvider } from './provide'
+import type { IndexAnchorProvider } from '../index-anchor/provide'
 
 export default defineComponent({
   name: 'VarIndexBar',
diff --git a/packages/varlet-ui/src/input/Input.vue b/packages/varlet-ui/src/input/Input.vue
index aa54fce4e24..c5dc257ef1a 100644
--- a/packages/varlet-ui/src/input/Input.vue
+++ b/packages/varlet-ui/src/input/Input.vue
@@ -3,7 +3,6 @@
     class="var-input var--box"
     :class="[disabled ? 'var-input--disabled' : null]"
     @click="handleClick"
-    v-bind="$attrs"
   >
     <div
       class="var-input__controller"
@@ -100,12 +99,14 @@
 <script lang="ts">
 import FormDetails from '../form-details'
 import Icon from '../icon'
-import { defineComponent, getCurrentInstance, ref, Ref, computed, ComputedRef, nextTick } from 'vue'
-import { props, ValidateTriggers } from './props'
+import { defineComponent, getCurrentInstance, ref, computed, nextTick } from 'vue'
+import { props } from './props'
 import { isEmpty, isNumber, toNumber } from '../utils/shared'
 import { useValidation } from '../utils/components'
 import { useForm } from '../form/provide'
-import { InputProvider } from './provide'
+import type { Ref, ComputedRef } from 'vue'
+import type { ValidateTriggers } from './props'
+import type { InputProvider } from './provide'
 
 export default defineComponent({
   name: 'VarInput',
@@ -113,7 +114,6 @@ export default defineComponent({
     [Icon.name]: Icon,
     [FormDetails.name]: FormDetails,
   },
-  inheritAttrs: false,
   props,
   setup(props) {
     const id: Ref<string> = ref(`var-input-${getCurrentInstance()!.uid}`)
diff --git a/packages/varlet-ui/src/lazy/index.ts b/packages/varlet-ui/src/lazy/index.ts
index fcf01902743..8fc7bc954c3 100644
--- a/packages/varlet-ui/src/lazy/index.ts
+++ b/packages/varlet-ui/src/lazy/index.ts
@@ -1,14 +1,13 @@
-import type { App, Directive, Plugin } from 'vue'
-import { DirectiveBinding } from '@vue/runtime-core'
 import { getParentScroller, inViewport } from '../utils/elements'
 import {
-  CacheInstance,
   checkIntersectionObserverAPI,
   createCache,
   createInViewportObserver,
   removeItem,
   throttle,
 } from '../utils/shared'
+import type { App, Directive, Plugin, DirectiveBinding } from 'vue'
+import type { CacheInstance } from '../utils/shared'
 
 interface LazyOptions {
   loading?: string
diff --git a/packages/varlet-ui/src/list/List.vue b/packages/varlet-ui/src/list/List.vue
index da320c48107..e185c02bb01 100644
--- a/packages/varlet-ui/src/list/List.vue
+++ b/packages/varlet-ui/src/list/List.vue
@@ -26,11 +26,12 @@
 <script lang="ts">
 import Ripple from '../ripple'
 import Loading from '../loading'
-import { defineComponent, onMounted, onUnmounted, ref, Ref, nextTick } from 'vue'
+import { defineComponent, onMounted, onUnmounted, ref, nextTick } from 'vue'
 import { getParentScroller, isHidden, toPxNum } from '../utils/elements'
 import { props } from './props'
 import { isNumber, dt } from '../utils/shared'
 import { pack } from '../locale'
+import type { Ref } from 'vue'
 
 export default defineComponent({
   name: 'VarList',
diff --git a/packages/varlet-ui/src/menu/Menu.vue b/packages/varlet-ui/src/menu/Menu.vue
index c36a76c39e4..ee1477c60bb 100644
--- a/packages/varlet-ui/src/menu/Menu.vue
+++ b/packages/varlet-ui/src/menu/Menu.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="var-menu" ref="host" v-bind="$attrs" @click="handleClick">
+  <div class="var-menu" ref="host" @click="handleClick">
     <slot />
 
     <teleport :to="teleport">
@@ -23,14 +23,14 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, ref, Ref, watch, onMounted, onUnmounted, nextTick } from 'vue'
+import { defineComponent, ref, watch, onMounted, onUnmounted, nextTick } from 'vue'
 import { props } from './props'
 import { getLeft, getTop, toSizeUnit } from '../utils/elements'
 import { useZIndex } from '../context/zIndex'
+import type { Ref } from 'vue'
 
 export default defineComponent({
   name: 'VarMenu',
-  inheritAttrs: false,
   props,
   setup(props) {
     const host: Ref<null | HTMLElement> = ref(null)
diff --git a/packages/varlet-ui/src/option/Option.vue b/packages/varlet-ui/src/option/Option.vue
index 313355b51a9..11f097b52f0 100644
--- a/packages/varlet-ui/src/option/Option.vue
+++ b/packages/varlet-ui/src/option/Option.vue
@@ -7,7 +7,6 @@
       color: optionSelected ? focusColor : null,
     }"
     v-ripple
-    v-bind="$attrs"
     @click="handleClick"
   >
     <div
@@ -37,9 +36,11 @@
 <script lang="ts">
 import Checkbox from '../checkbox'
 import Ripple from '../ripple'
-import { defineComponent, computed, ComputedRef, ref, Ref, watch } from 'vue'
-import { OptionProvider, useSelect } from './provide'
+import { defineComponent, computed, ref, watch } from 'vue'
+import { useSelect } from './provide'
 import { props } from './props'
+import type { Ref, ComputedRef } from 'vue'
+import type { OptionProvider } from './provide'
 
 export default defineComponent({
   name: 'VarOption',
@@ -47,7 +48,6 @@ export default defineComponent({
   components: {
     [Checkbox.name]: Checkbox,
   },
-  inheritAttrs: false,
   props,
   setup(props) {
     const optionSelected: Ref<boolean> = ref(false)
diff --git a/packages/varlet-ui/src/picker/Picker.vue b/packages/varlet-ui/src/picker/Picker.vue
index 568c48a4297..2658d7785d1 100644
--- a/packages/varlet-ui/src/picker/Picker.vue
+++ b/packages/varlet-ui/src/picker/Picker.vue
@@ -94,12 +94,14 @@
 <script lang="ts">
 import Button from '../button'
 import Popup from '../popup'
-import { defineComponent, watch, ref, Ref, computed, ComputedRef, Transition, toRaw } from 'vue'
-import { CascadeColumn, NormalColumn, props } from './props'
+import { defineComponent, watch, ref, computed, Transition, toRaw } from 'vue'
+import { props } from './props'
 import { isArray, dt } from '../utils/shared'
 import { toPxNum, getTranslate } from '../utils/elements'
 import { pack } from '../locale'
-import { Texts } from './index'
+import type { Ref, ComputedRef } from 'vue'
+import type { CascadeColumn, NormalColumn } from './props'
+import type { Texts } from './index'
 
 interface ScrollColumn {
   touching: boolean
diff --git a/packages/varlet-ui/src/pull-refresh/PullRefresh.vue b/packages/varlet-ui/src/pull-refresh/PullRefresh.vue
index f193aab7f59..d11dacb1131 100644
--- a/packages/varlet-ui/src/pull-refresh/PullRefresh.vue
+++ b/packages/varlet-ui/src/pull-refresh/PullRefresh.vue
@@ -19,11 +19,13 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, ref, Ref, computed, watch, onMounted } from 'vue'
+import { defineComponent, ref, computed, watch, onMounted } from 'vue'
 import Icon from '../icon'
 import { getParentScroller, getScrollTop } from '../utils/elements'
-import { props, RefreshStatus } from './props'
+import { props } from './props'
 import { toNumber } from '../utils/shared'
+import type { Ref } from 'vue'
+import type { RefreshStatus } from './props'
 
 const MAX_DISTANCE = 100
 const CONTROL_POSITION = -50
diff --git a/packages/varlet-ui/src/radio-group/RadioGroup.vue b/packages/varlet-ui/src/radio-group/RadioGroup.vue
index 249525b11c8..53218be144f 100644
--- a/packages/varlet-ui/src/radio-group/RadioGroup.vue
+++ b/packages/varlet-ui/src/radio-group/RadioGroup.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="var-radio-group__wrap" v-bind="$attrs">
+  <div class="var-radio-group__wrap">
     <div class="var-radio-group" :class="[`var-radio-group--${direction}`]">
       <slot />
     </div>
@@ -10,18 +10,20 @@
 
 <script lang="ts">
 import FormDetails from '../form-details'
-import { computed, ComputedRef, defineComponent, nextTick, watch } from 'vue'
-import { props, ValidateTriggers } from './props'
+import { computed, defineComponent, nextTick, watch } from 'vue'
+import { props } from './props'
 import { useValidation } from '../utils/components'
-import { RadioGroupProvider, useRadios } from './provide'
+import { useRadios } from './provide'
 import { useForm } from '../form/provide'
+import type { ComputedRef } from 'vue'
+import type { ValidateTriggers } from './props'
+import type { RadioGroupProvider } from './provide'
 
 export default defineComponent({
   name: 'VarRadioGroup',
   components: {
     [FormDetails.name]: FormDetails,
   },
-  inheritAttrs: false,
   props,
   setup(props) {
     const { length, radios, bindRadios } = useRadios()
diff --git a/packages/varlet-ui/src/radio/Radio.vue b/packages/varlet-ui/src/radio/Radio.vue
index bc8adc0f4e6..d7ab1ec2a17 100644
--- a/packages/varlet-ui/src/radio/Radio.vue
+++ b/packages/varlet-ui/src/radio/Radio.vue
@@ -49,11 +49,14 @@
 import Ripple from '../ripple'
 import Icon from '../icon'
 import FormDetails from '../form-details'
-import { computed, ComputedRef, defineComponent, nextTick, ref, Ref, watch } from 'vue'
-import { props, ValidateTriggers } from './props'
+import { computed, defineComponent, nextTick, ref, watch } from 'vue'
+import { props } from './props'
 import { useValidation } from '../utils/components'
-import { RadioProvider, useRadioGroup } from './provide'
+import { useRadioGroup } from './provide'
 import { useForm } from '../form/provide'
+import type { Ref, ComputedRef } from 'vue'
+import type { ValidateTriggers } from './props'
+import type { RadioProvider } from './provide'
 
 export default defineComponent({
   name: 'VarRadio',
diff --git a/packages/varlet-ui/src/rate/Rate.vue b/packages/varlet-ui/src/rate/Rate.vue
index acf42064304..9c305f5f228 100644
--- a/packages/varlet-ui/src/rate/Rate.vue
+++ b/packages/varlet-ui/src/rate/Rate.vue
@@ -25,8 +25,8 @@ import { useForm } from '../form/provide'
 import { useValidation } from '../utils/components'
 import { toSizeUnit } from '../utils/elements'
 import { toNumber } from '../utils/shared'
-import { RateProvider } from './provide'
 import { props } from './props'
+import type { RateProvider } from './provide'
 
 export default defineComponent({
   name: 'VarRate',
diff --git a/packages/varlet-ui/src/row/Row.vue b/packages/varlet-ui/src/row/Row.vue
index 4151bd6d762..16b46df307e 100644
--- a/packages/varlet-ui/src/row/Row.vue
+++ b/packages/varlet-ui/src/row/Row.vue
@@ -15,9 +15,10 @@
 <script lang="ts">
 import { defineComponent, watch } from 'vue'
 import { props } from './props'
-import { RowProvider, useCols } from './provide'
-import { ColProvider } from '../col/provide'
+import { useCols } from './provide'
 import { toPxNum } from '../utils/elements'
+import type { ColProvider } from '../col/provide'
+import type { RowProvider } from './provide'
 
 export default defineComponent({
   name: 'VarRow',
diff --git a/packages/varlet-ui/src/select/Select.vue b/packages/varlet-ui/src/select/Select.vue
index d64b318e06c..dc9d4ccbbff 100644
--- a/packages/varlet-ui/src/select/Select.vue
+++ b/packages/varlet-ui/src/select/Select.vue
@@ -3,7 +3,6 @@
     class="var-select var--box"
     :class="[formDisabled || disabled ? 'var-select--disabled' : null]"
     @click="handleClick"
-    v-bind="$attrs"
   >
     <div
       class="var-select__controller"
@@ -131,14 +130,17 @@ import Icon from '../icon'
 import Menu from '../menu'
 import Chip from '../chip'
 import FormDetails from '../form-details'
-import { computed, ComputedRef, defineComponent, ref, Ref, watch, nextTick } from 'vue'
+import { computed, defineComponent, ref, watch, nextTick } from 'vue'
 import { isArray, isEmpty } from '../utils/shared'
-import { props, ValidateTriggers } from './props'
+import { props } from './props'
 import { useValidation } from '../utils/components'
-import { SelectProvider, useOptions } from './provide'
-import { OptionProvider } from '../option/provide'
+import { useOptions } from './provide'
 import { useForm } from '../form/provide'
 import { toPxNum } from '../utils/elements'
+import type { Ref, ComputedRef } from 'vue'
+import type { ValidateTriggers } from './props'
+import type { SelectProvider } from './provide'
+import type { OptionProvider } from '../option/provide'
 
 export default defineComponent({
   name: 'VarSelect',
@@ -148,7 +150,6 @@ export default defineComponent({
     [Chip.name]: Chip,
     [FormDetails.name]: FormDetails,
   },
-  inheritAttrs: false,
   props,
   setup(props) {
     const wrapEl: Ref<HTMLElement | null> = ref(null)
diff --git a/packages/varlet-ui/src/slider/Slider.vue b/packages/varlet-ui/src/slider/Slider.vue
index 4d81ab9a86d..93931a2244d 100644
--- a/packages/varlet-ui/src/slider/Slider.vue
+++ b/packages/varlet-ui/src/slider/Slider.vue
@@ -114,14 +114,15 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, Ref, ref, onMounted, computed, ComputedRef, reactive, UnwrapRef, nextTick, watch } from 'vue'
+import { defineComponent, ref, onMounted, computed, reactive, nextTick, watch } from 'vue'
 import { useValidation } from '../utils/components'
 import { useForm } from '../form/provide'
 import { getLeft } from '../utils/elements'
 import { isArray, isNumber, toNumber } from '../utils/shared'
 import { props } from './props'
-import { SliderProvider } from './provide'
 import FormDetails from '../form-details'
+import type { Ref, ComputedRef, UnwrapRef } from 'vue'
+import type { SliderProvider } from './provide'
 
 type ThumbProps = {
   startPosition: number
diff --git a/packages/varlet-ui/src/snackbar/core.vue b/packages/varlet-ui/src/snackbar/core.vue
index 54b7854ad2a..1a274723cff 100644
--- a/packages/varlet-ui/src/snackbar/core.vue
+++ b/packages/varlet-ui/src/snackbar/core.vue
@@ -14,14 +14,16 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, watch, ref, Ref, onMounted, computed, ComputedRef } from 'vue'
+import { defineComponent, watch, ref, onMounted, computed } from 'vue'
 import Loading from '../loading'
 import Button from '../button'
 import Icon from '../icon'
 import { useZIndex } from '../context/zIndex'
 import { props } from './props'
 import { useLock } from '../context/lock'
-import { SNACKBAR_TYPE, SnackbarType } from './index'
+import { SNACKBAR_TYPE } from './index'
+import type { Ref, ComputedRef } from 'vue'
+import type { SnackbarType } from './index'
 
 const ICON_TYPE_DICT: Record<SnackbarType, string> = {
   success: 'checkbox-marked-circle',
diff --git a/packages/varlet-ui/src/step/Step.vue b/packages/varlet-ui/src/step/Step.vue
index 47f93c8bb54..f16546434b9 100644
--- a/packages/varlet-ui/src/step/Step.vue
+++ b/packages/varlet-ui/src/step/Step.vue
@@ -50,10 +50,12 @@
 </template>
 
 <script lang="ts">
-import { computed, ComputedRef, defineComponent, ref, Ref, watch } from 'vue'
+import { computed, defineComponent, ref, watch } from 'vue'
 import { props } from './props'
-import { StepProvider, useSteps } from './provide'
+import { useSteps } from './provide'
 import Icon from '../icon'
+import type { Ref, ComputedRef } from 'vue'
+import type { StepProvider } from './provide'
 
 export default defineComponent({
   name: 'VarStep',
diff --git a/packages/varlet-ui/src/steps/Steps.vue b/packages/varlet-ui/src/steps/Steps.vue
index 37ed75e131f..2b60f2cd787 100644
--- a/packages/varlet-ui/src/steps/Steps.vue
+++ b/packages/varlet-ui/src/steps/Steps.vue
@@ -5,9 +5,11 @@
 </template>
 
 <script lang="ts">
-import { computed, ComputedRef, defineComponent } from 'vue'
-import { StepsProvider, useStep } from './provide'
+import { computed, defineComponent } from 'vue'
+import { useStep } from './provide'
 import { props } from './props'
+import type { ComputedRef } from 'vue'
+import type { StepsProvider } from './provide'
 
 export default defineComponent({
   name: 'VarSteps',
diff --git a/packages/varlet-ui/src/sticky/Sticky.vue b/packages/varlet-ui/src/sticky/Sticky.vue
index 4b461df8200..44461b870a5 100644
--- a/packages/varlet-ui/src/sticky/Sticky.vue
+++ b/packages/varlet-ui/src/sticky/Sticky.vue
@@ -27,10 +27,11 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, ref, Ref, onMounted, onUnmounted, computed, ComputedRef } from 'vue'
+import { defineComponent, ref, onMounted, onUnmounted, computed } from 'vue'
 import { props } from './props'
 import { getParentScroller, toPxNum } from '../utils/elements'
 import { toNumber } from '../utils/shared'
+import type { Ref, ComputedRef } from 'vue'
 
 export default defineComponent({
   name: 'VarSticky',
diff --git a/packages/varlet-ui/src/style-provider/StyleProvider.vue b/packages/varlet-ui/src/style-provider/StyleProvider.vue
index 8dbf9d96dc2..9a177370591 100644
--- a/packages/varlet-ui/src/style-provider/StyleProvider.vue
+++ b/packages/varlet-ui/src/style-provider/StyleProvider.vue
@@ -1,7 +1,8 @@
 <script lang="ts">
-import { defineComponent, h, PropType } from 'vue'
-import { StyleVars } from './index'
+import { defineComponent, h } from 'vue'
 import { formatStyleVars } from '../utils/elements'
+import type { PropType } from 'vue'
+import type { StyleVars } from './index'
 
 export default defineComponent({
   name: 'VarStyleProvider',
diff --git a/packages/varlet-ui/src/swipe-item/SwipeItem.vue b/packages/varlet-ui/src/swipe-item/SwipeItem.vue
index 9e44fbbf7cd..5994a54df44 100644
--- a/packages/varlet-ui/src/swipe-item/SwipeItem.vue
+++ b/packages/varlet-ui/src/swipe-item/SwipeItem.vue
@@ -6,19 +6,19 @@
       height: vertical ? `${size}px` : null,
       transform: `translate${vertical ? 'Y' : 'X'}(${translate}px)`,
     }"
-    v-bind="$attrs"
   >
     <slot />
   </div>
 </template>
 
 <script lang="ts">
-import { defineComponent, ref, Ref } from 'vue'
-import { SwipeItemProvider, useSwipe } from './provide'
+import { defineComponent, ref } from 'vue'
+import { useSwipe } from './provide'
+import type { Ref } from 'vue'
+import type { SwipeItemProvider } from './provide'
 
 export default defineComponent({
   name: 'VarSwipeItem',
-  inheritAttrs: false,
   setup() {
     const translate: Ref<number> = ref(0)
     const { swipe, bindSwipe, index } = useSwipe()
diff --git a/packages/varlet-ui/src/swipe/Swipe.vue b/packages/varlet-ui/src/swipe/Swipe.vue
index c0ab3ea5549..688d39df498 100644
--- a/packages/varlet-ui/src/swipe/Swipe.vue
+++ b/packages/varlet-ui/src/swipe/Swipe.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="var-swipe" ref="swipeEl" v-bind="$attrs">
+  <div class="var-swipe" ref="swipeEl">
     <div
       class="var-swipe__track"
       :class="[vertical ? 'var-swipe--vertical' : null]"
@@ -39,19 +39,20 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, ref, Ref, computed, ComputedRef, watch, onUnmounted } from 'vue'
-import { SwipeProvider, useSwipeItems } from './provide'
+import { defineComponent, ref, computed, watch, onUnmounted } from 'vue'
+import { useSwipeItems } from './provide'
 import { nextTickFrame } from '../utils/elements'
-import { SwipeItemProvider } from '../swipe-item/provide'
 import { props } from './props'
 import { isNumber, toNumber } from '../utils/shared'
+import type { Ref, ComputedRef } from 'vue'
+import type { SwipeProvider } from './provide'
+import type { SwipeItemProvider } from '../swipe-item/provide'
 
 const SWIPE_DELAY = 250
 const SWIPE_DISTANCE = 20
 
 export default defineComponent({
   name: 'VarSwipe',
-  inheritAttrs: false,
   props,
   setup(props) {
     const swipeEl: Ref<HTMLElement | null> = ref(null)
diff --git a/packages/varlet-ui/src/switch/Switch.vue b/packages/varlet-ui/src/switch/Switch.vue
index 6443bdb0e64..a4f43a55efa 100644
--- a/packages/varlet-ui/src/switch/Switch.vue
+++ b/packages/varlet-ui/src/switch/Switch.vue
@@ -32,15 +32,16 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, ComputedRef, computed, nextTick } from 'vue'
+import { defineComponent, computed, nextTick } from 'vue'
 import { useValidation } from '../utils/components'
 import { toNumber } from '../utils/shared'
-import { SwitchProvider } from './provide'
 import { useForm } from '../form/provide'
 import { props } from './props'
 import FormDetails from '../form-details'
 import Loading from '../loading'
 import Ripple from '../ripple'
+import type { ComputedRef } from 'vue'
+import type { SwitchProvider } from './provide'
 
 type StyleProps = {
   width: string
diff --git a/packages/varlet-ui/src/tab-item/TabItem.vue b/packages/varlet-ui/src/tab-item/TabItem.vue
index 23c8bb67337..9e432bd1251 100644
--- a/packages/varlet-ui/src/tab-item/TabItem.vue
+++ b/packages/varlet-ui/src/tab-item/TabItem.vue
@@ -7,9 +7,11 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, ref, Ref, computed, ComputedRef, watch } from 'vue'
-import { TabItemProvider, useTabsItems } from './provide'
+import { defineComponent, ref, computed, watch } from 'vue'
+import { useTabsItems } from './provide'
 import { props } from './props'
+import type { Ref, ComputedRef } from 'vue'
+import type { TabItemProvider } from './provide'
 
 export default defineComponent({
   name: 'VarTabItem',
diff --git a/packages/varlet-ui/src/tab/Tab.vue b/packages/varlet-ui/src/tab/Tab.vue
index ee07c08e614..995ee1e0d49 100644
--- a/packages/varlet-ui/src/tab/Tab.vue
+++ b/packages/varlet-ui/src/tab/Tab.vue
@@ -14,10 +14,12 @@
 </template>
 
 <script lang="ts">
-import Ripple from '../ripple'
-import { defineComponent, Ref, ref, computed, ComputedRef, watch } from 'vue'
+import { defineComponent, ref, computed, watch } from 'vue'
 import { props } from './props'
-import { TabProvider, useTabs } from './provide'
+import Ripple from '../ripple'
+import { useTabs } from './provide'
+import type { Ref, ComputedRef } from 'vue'
+import type { TabProvider } from './provide'
 
 export default defineComponent({
   name: 'VarTab',
diff --git a/packages/varlet-ui/src/tabs-items/TabsItems.vue b/packages/varlet-ui/src/tabs-items/TabsItems.vue
index e3a4b973eab..24d88161637 100644
--- a/packages/varlet-ui/src/tabs-items/TabsItems.vue
+++ b/packages/varlet-ui/src/tabs-items/TabsItems.vue
@@ -4,21 +4,21 @@
     :style="{
       height: transitionHeight,
     }"
-    v-bind="$attrs"
   >
-    <slot></slot>
+    <slot />
   </div>
 </template>
 
 <script lang="ts">
-import { defineComponent, computed, watch, ref, Ref, nextTick, ComputedRef } from 'vue'
-import { TabsItemsProvider, useTabItem } from './provide'
+import { defineComponent, computed, watch, ref, nextTick } from 'vue'
+import { useTabItem } from './provide'
 import { props } from './props'
-import { TabItemProvider } from '../tab-item/provide'
+import type { Ref, ComputedRef } from 'vue'
+import type { TabsItemsProvider } from './provide'
+import type { TabItemProvider } from '../tab-item/provide'
 
 export default defineComponent({
   name: 'VarTabsItems',
-  inheritAttrs: false,
   props,
   setup(props) {
     const transitionHeight: Ref<string> = ref('auto')
diff --git a/packages/varlet-ui/src/tabs/Tabs.vue b/packages/varlet-ui/src/tabs/Tabs.vue
index 03344ea0f3a..f8fcaa05d82 100644
--- a/packages/varlet-ui/src/tabs/Tabs.vue
+++ b/packages/varlet-ui/src/tabs/Tabs.vue
@@ -42,19 +42,19 @@ import {
   defineComponent,
   watch,
   ref,
-  Ref,
   computed,
   Transition,
-  ComputedRef,
   nextTick,
   onMounted,
   onUnmounted,
 } from 'vue'
 import { props } from './props'
-import { TabsProvider, useTabList } from './provide'
-import { TabProvider } from '../tab/provide'
+import { useTabList } from './provide'
 import { isNumber, linear } from '../utils/shared'
 import { toSizeUnit, scrollTo } from '../utils/elements'
+import type { Ref, ComputedRef } from 'vue'
+import type { TabsProvider } from './provide'
+import type { TabProvider } from '../tab/provide'
 
 export default defineComponent({
   name: 'VarTabs',
diff --git a/packages/varlet-ui/src/time-picker/TimePicker.vue b/packages/varlet-ui/src/time-picker/TimePicker.vue
index cad5876179d..0be23092fcf 100644
--- a/packages/varlet-ui/src/time-picker/TimePicker.vue
+++ b/packages/varlet-ui/src/time-picker/TimePicker.vue
@@ -77,12 +77,14 @@
 </template>
 
 <script lang="ts">
-import { computed, ComputedRef, defineComponent, reactive, ref, Ref, watch, DefineComponent, UnwrapRef } from 'vue'
+import { computed, defineComponent, reactive, ref, watch } from 'vue'
 import dayjs from 'dayjs'
 import Clock from './clock.vue'
-import { props, Time, AmPm, hoursAmpm, hours24 } from './props'
+import { props, hoursAmpm, hours24 } from './props'
 import { toNumber } from '../utils/shared'
 import { getNumberTime, getIsDisableMinute, getIsDisableSecond } from './utils'
+import type { ComputedRef, Ref, DefineComponent, UnwrapRef } from 'vue'
+import type { Time, AmPm } from './props'
 
 export default defineComponent({
   name: 'VarTimePicker',
diff --git a/packages/varlet-ui/src/time-picker/clock.vue b/packages/varlet-ui/src/time-picker/clock.vue
index df33e980879..a937cd2c6df 100644
--- a/packages/varlet-ui/src/time-picker/clock.vue
+++ b/packages/varlet-ui/src/time-picker/clock.vue
@@ -31,11 +31,13 @@
 </template>
 
 <script lang="ts">
-import { computed, ComputedRef, defineComponent, PropType, ref, Ref, watch } from 'vue'
+import { computed, defineComponent, ref, watch } from 'vue'
 import dayjs from 'dayjs'
-import { hoursAmpm, hours24, minSec, Time, AmPm, Format } from './props'
+import { hoursAmpm, hours24, minSec } from './props'
 import { notConvert, convertHour, getIsDisableMinute, getIsDisableSecond, getNumberTime } from './utils'
 import { toNumber } from '../utils/shared'
+import type { ComputedRef, Ref, PropType } from 'vue'
+import type { Time, AmPm, Format } from './props'
 
 export default defineComponent({
   name: 'Clock',
diff --git a/packages/varlet-ui/src/uploader/Uploader.vue b/packages/varlet-ui/src/uploader/Uploader.vue
index 6a25305e508..17ae296582b 100644
--- a/packages/varlet-ui/src/uploader/Uploader.vue
+++ b/packages/varlet-ui/src/uploader/Uploader.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="var-uploader var--box" v-bind="$attrs">
+  <div class="var-uploader var--box">
     <div class="var-uploader__file-list">
       <div
         class="var-uploader__file var-elevation--2"
@@ -85,12 +85,14 @@ import Ripple from '../ripple'
 import Icon from '../icon'
 import Popup from '../popup'
 import ImagePreview from '../image-preview'
-import { defineComponent, nextTick, reactive, computed, ComputedRef, watch, ref, Ref } from 'vue'
-import { props, VarFile, ValidateTriggers } from './props'
+import { defineComponent, nextTick, reactive, computed, watch, ref } from 'vue'
+import { props } from './props'
 import { isNumber, isHTMLSupportImage, isHTMLSupportVideo, toNumber, isString } from '../utils/shared'
 import { useValidation } from '../utils/components'
 import { useForm } from '../form/provide'
-import { UploaderProvider } from './provide'
+import type { ComputedRef, Ref } from 'vue'
+import type { UploaderProvider } from './provide'
+import type { VarFile, ValidateTriggers } from './props'
 
 interface ValidationVarFile {
   valid: boolean
@@ -111,7 +113,6 @@ export default defineComponent({
     [Popup.name]: Popup,
     [FormDetails.name]: FormDetails,
   },
-  inheritAttrs: false,
   props,
   setup(props) {
     const showPreview: Ref<boolean> = ref(false)