diff --git a/packages/core/onClickOutside/component.ts b/packages/core/onClickOutside/component.ts
index 712c311d41e..83b2727cb27 100644
--- a/packages/core/onClickOutside/component.ts
+++ b/packages/core/onClickOutside/component.ts
@@ -7,7 +7,7 @@ export interface OnClickOutsideProps extends RenderableComponent {
   options?: OnClickOutsideOptions
 }
 
-export const OnClickOutside = defineComponent<OnClickOutsideProps>({
+export const OnClickOutside = /* #__PURE__ */ defineComponent<OnClickOutsideProps>({
   name: 'OnClickOutside',
   props: ['as', 'options'] as unknown as undefined,
   emits: ['trigger'],
diff --git a/packages/core/onLongPress/component.ts b/packages/core/onLongPress/component.ts
index 01547ff27c8..edef35212fe 100644
--- a/packages/core/onLongPress/component.ts
+++ b/packages/core/onLongPress/component.ts
@@ -7,7 +7,7 @@ export interface OnLongPressProps extends RenderableComponent {
   options?: OnLongPressOptions
 }
 
-export const OnLongPress = defineComponent<OnLongPressProps>({
+export const OnLongPress = /* #__PURE__ */ defineComponent<OnLongPressProps>({
   name: 'OnLongPress',
   props: ['as', 'options'] as unknown as undefined,
   emits: ['trigger'],
diff --git a/packages/core/useActiveElement/component.ts b/packages/core/useActiveElement/component.ts
index 738aaa11872..1318040f61a 100644
--- a/packages/core/useActiveElement/component.ts
+++ b/packages/core/useActiveElement/component.ts
@@ -1,7 +1,7 @@
 import { defineComponent, reactive } from 'vue-demi'
 import { useActiveElement } from '@vueuse/core'
 
-export const UseActiveElement = defineComponent({
+export const UseActiveElement = /* #__PURE__ */ defineComponent({
   name: 'UseActiveElement',
   setup(props, { slots }) {
     const data = reactive({
diff --git a/packages/core/useBattery/component.ts b/packages/core/useBattery/component.ts
index 163cc241a24..329277c6679 100644
--- a/packages/core/useBattery/component.ts
+++ b/packages/core/useBattery/component.ts
@@ -1,7 +1,7 @@
 import { defineComponent, reactive } from 'vue-demi'
 import { useBattery } from '@vueuse/core'
 
-export const UseBattery = defineComponent({
+export const UseBattery = /* #__PURE__ */ defineComponent({
   name: 'UseBattery',
   setup(props, { slots }) {
     const data = reactive(useBattery(props))
diff --git a/packages/core/useBrowserLocation/component.ts b/packages/core/useBrowserLocation/component.ts
index a0dd3541e8a..8321ac1a58f 100644
--- a/packages/core/useBrowserLocation/component.ts
+++ b/packages/core/useBrowserLocation/component.ts
@@ -1,7 +1,7 @@
 import { defineComponent, reactive } from 'vue-demi'
 import { useBrowserLocation } from '@vueuse/core'
 
-export const UseBrowserLocation = defineComponent({
+export const UseBrowserLocation = /* #__PURE__ */ defineComponent({
   name: 'UseBrowserLocation',
   setup(props, { slots }) {
     const data = reactive(useBrowserLocation())
diff --git a/packages/core/useColorMode/component.ts b/packages/core/useColorMode/component.ts
index 34f6845abc3..bd1c4cd41b4 100644
--- a/packages/core/useColorMode/component.ts
+++ b/packages/core/useColorMode/component.ts
@@ -2,7 +2,7 @@ import { defineComponent, reactive } from 'vue-demi'
 import type { UseColorModeOptions } from '.'
 import { useColorMode } from '.'
 
-export const UseColorMode = defineComponent<UseColorModeOptions>({
+export const UseColorMode = /* #__PURE__ */ defineComponent<UseColorModeOptions>({
   name: 'UseColorMode',
   props: ['selector', 'attribute', 'modes', 'onChanged', 'storageKey', 'storage', 'emitAuto'] as unknown as undefined,
   setup(props, { slots }) {
diff --git a/packages/core/useDark/component.ts b/packages/core/useDark/component.ts
index d7702b102a7..0a698b5615b 100644
--- a/packages/core/useDark/component.ts
+++ b/packages/core/useDark/component.ts
@@ -3,7 +3,7 @@ import type { UseDarkOptions } from '@vueuse/core'
 import { useDark } from '@vueuse/core'
 import { useToggle } from '@vueuse/shared'
 
-export const UseDark = defineComponent<UseDarkOptions>({
+export const UseDark = /* #__PURE__ */ defineComponent<UseDarkOptions>({
   name: 'UseDark',
   props: ['selector', 'attribute', 'valueDark', 'valueLight', 'onChanged', 'storageKey', 'storage'] as unknown as undefined,
   setup(props, { slots }) {
diff --git a/packages/core/useDeviceMotion/component.ts b/packages/core/useDeviceMotion/component.ts
index 5e3397610df..6d2fcf07205 100644
--- a/packages/core/useDeviceMotion/component.ts
+++ b/packages/core/useDeviceMotion/component.ts
@@ -1,7 +1,7 @@
 import { defineComponent, reactive } from 'vue-demi'
 import { useDeviceMotion } from '@vueuse/core'
 
-export const UseDeviceMotion = defineComponent({
+export const UseDeviceMotion = /* #__PURE__ */ defineComponent({
   name: 'UseDeviceMotion',
   setup(props, { slots }) {
     const data = reactive(useDeviceMotion())
diff --git a/packages/core/useDeviceOrientation/component.ts b/packages/core/useDeviceOrientation/component.ts
index 8d32d55a920..51e83a6a11f 100644
--- a/packages/core/useDeviceOrientation/component.ts
+++ b/packages/core/useDeviceOrientation/component.ts
@@ -1,7 +1,7 @@
 import { defineComponent, reactive } from 'vue-demi'
 import { useDeviceOrientation } from '@vueuse/core'
 
-export const UseDeviceOrientation = defineComponent({
+export const UseDeviceOrientation = /* #__PURE__ */ defineComponent({
   name: 'UseDeviceOrientation',
   setup(props, { slots }) {
     const data = reactive(useDeviceOrientation())
diff --git a/packages/core/useDevicePixelRatio/component.ts b/packages/core/useDevicePixelRatio/component.ts
index c0fa265b1eb..b9f1d9ca44c 100644
--- a/packages/core/useDevicePixelRatio/component.ts
+++ b/packages/core/useDevicePixelRatio/component.ts
@@ -1,7 +1,7 @@
 import { defineComponent, reactive } from 'vue-demi'
 import { useDevicePixelRatio } from '@vueuse/core'
 
-export const UseDevicePixelRatio = defineComponent({
+export const UseDevicePixelRatio = /* #__PURE__ */ defineComponent({
   name: 'UseDevicePixelRatio',
   setup(props, { slots }) {
     const data = reactive({
diff --git a/packages/core/useDevicesList/component.ts b/packages/core/useDevicesList/component.ts
index 2b9f95f92b5..c3a349dd35a 100644
--- a/packages/core/useDevicesList/component.ts
+++ b/packages/core/useDevicesList/component.ts
@@ -2,7 +2,7 @@ import { defineComponent, reactive } from 'vue-demi'
 import type { UseDevicesListOptions } from '@vueuse/core'
 import { useDevicesList } from '@vueuse/core'
 
-export const UseDevicesList = defineComponent<UseDevicesListOptions>({
+export const UseDevicesList = /* #__PURE__ */ defineComponent<UseDevicesListOptions>({
   name: 'UseDevicesList',
   props: ['onUpdated', 'requestPermissions', 'constraints'] as unknown as undefined,
   setup(props, { slots }) {
diff --git a/packages/core/useDocumentVisibility/component.ts b/packages/core/useDocumentVisibility/component.ts
index 445d8e56f26..9a801b09c3a 100644
--- a/packages/core/useDocumentVisibility/component.ts
+++ b/packages/core/useDocumentVisibility/component.ts
@@ -1,7 +1,7 @@
 import { defineComponent, reactive } from 'vue-demi'
 import { useDocumentVisibility } from '@vueuse/core'
 
-export const UseDocumentVisibility = defineComponent({
+export const UseDocumentVisibility = /* #__PURE__ */ defineComponent({
   name: 'UseDocumentVisibility',
   setup(props, { slots }) {
     const data = reactive({
diff --git a/packages/core/useDraggable/component.ts b/packages/core/useDraggable/component.ts
index 8d55c5d5cfe..52bd0d49b63 100644
--- a/packages/core/useDraggable/component.ts
+++ b/packages/core/useDraggable/component.ts
@@ -18,7 +18,7 @@ export interface UseDraggableProps extends UseDraggableOptions, RenderableCompon
   storageType?: 'local' | 'session'
 }
 
-export const UseDraggable = defineComponent<UseDraggableProps>({
+export const UseDraggable = /* #__PURE__ */ defineComponent<UseDraggableProps>({
   name: 'UseDraggable',
   props: [
     'storageKey',
diff --git a/packages/core/useElementBounding/component.ts b/packages/core/useElementBounding/component.ts
index f8789532dee..c77c7c783f4 100644
--- a/packages/core/useElementBounding/component.ts
+++ b/packages/core/useElementBounding/component.ts
@@ -3,7 +3,7 @@ import { useElementBounding } from '@vueuse/core'
 import type { UseResizeObserverOptions } from '../useResizeObserver'
 import type { RenderableComponent } from '../types'
 
-export const UseElementBounding = defineComponent<UseResizeObserverOptions & RenderableComponent>({
+export const UseElementBounding = /* #__PURE__ */ defineComponent<UseResizeObserverOptions & RenderableComponent>({
   name: 'UseElementBounding',
   props: ['box', 'as'] as unknown as undefined,
   setup(props, { slots }) {
diff --git a/packages/core/useElementSize/component.ts b/packages/core/useElementSize/component.ts
index 5348ed67522..c077cdc8cd2 100644
--- a/packages/core/useElementSize/component.ts
+++ b/packages/core/useElementSize/component.ts
@@ -4,7 +4,7 @@ import { useElementSize } from '@vueuse/core'
 import type { RenderableComponent } from '../types'
 import type { UseResizeObserverOptions } from '../useResizeObserver'
 
-export const UseElementSize = defineComponent<ElementSize & UseResizeObserverOptions & RenderableComponent>({
+export const UseElementSize = /* #__PURE__ */ defineComponent<ElementSize & UseResizeObserverOptions & RenderableComponent>({
   name: 'UseElementSize',
   props: ['width', 'height', 'box'] as unknown as undefined,
   setup(props, { slots }) {
diff --git a/packages/core/useElementVisibility/component.ts b/packages/core/useElementVisibility/component.ts
index d03397b00f0..bf09be676e2 100644
--- a/packages/core/useElementVisibility/component.ts
+++ b/packages/core/useElementVisibility/component.ts
@@ -2,7 +2,7 @@ import { defineComponent, h, reactive, ref } from 'vue-demi'
 import { useElementVisibility } from '@vueuse/core'
 import type { RenderableComponent } from '../types'
 
-export const UseElementVisibility = defineComponent<RenderableComponent>({
+export const UseElementVisibility = /* #__PURE__ */ defineComponent<RenderableComponent>({
   name: 'UseElementVisibility',
   props: ['as'] as unknown as undefined,
   setup(props, { slots }) {
diff --git a/packages/core/useEyeDropper/component.ts b/packages/core/useEyeDropper/component.ts
index b48a83cf5f9..a86758ba722 100644
--- a/packages/core/useEyeDropper/component.ts
+++ b/packages/core/useEyeDropper/component.ts
@@ -1,7 +1,7 @@
 import { defineComponent, reactive } from 'vue-demi'
 import { useEyeDropper } from '@vueuse/core'
 
-export const UseEyeDropper = defineComponent({
+export const UseEyeDropper = /* #__PURE__ */ defineComponent({
   name: 'UseEyeDropper',
   props: {
     sRGBHex: String,
diff --git a/packages/core/useFullscreen/component.ts b/packages/core/useFullscreen/component.ts
index a6325efce29..ad25da2a96e 100644
--- a/packages/core/useFullscreen/component.ts
+++ b/packages/core/useFullscreen/component.ts
@@ -2,7 +2,7 @@ import { defineComponent, h, reactive, ref } from 'vue-demi'
 import { useFullscreen } from '@vueuse/core'
 import type { RenderableComponent } from '../types'
 
-export const UseFullscreen = defineComponent<RenderableComponent>({
+export const UseFullscreen = /* #__PURE__ */ defineComponent<RenderableComponent>({
   name: 'UseFullscreen',
   props: ['as'] as unknown as undefined,
   setup(props, { slots }) {
diff --git a/packages/core/useGeolocation/component.ts b/packages/core/useGeolocation/component.ts
index c419dfab30a..0ac0d9ec571 100644
--- a/packages/core/useGeolocation/component.ts
+++ b/packages/core/useGeolocation/component.ts
@@ -2,7 +2,7 @@ import { defineComponent, reactive } from 'vue-demi'
 import type { UseGeolocationOptions } from '@vueuse/core'
 import { useGeolocation } from '@vueuse/core'
 
-export const UseGeolocation = defineComponent<UseGeolocationOptions>({
+export const UseGeolocation = /* #__PURE__ */ defineComponent<UseGeolocationOptions>({
   name: 'UseGeolocation',
   props: ['enableHighAccuracy', 'maximumAge', 'timeout', 'navigator'] as unknown as undefined,
   setup(props, { slots }) {
diff --git a/packages/core/useIdle/component.ts b/packages/core/useIdle/component.ts
index 4d234b82d70..238f88a409b 100644
--- a/packages/core/useIdle/component.ts
+++ b/packages/core/useIdle/component.ts
@@ -2,7 +2,7 @@ import { defineComponent, reactive } from 'vue-demi'
 import type { UseIdleOptions } from '@vueuse/core'
 import { useIdle } from '@vueuse/core'
 
-export const UseIdle = defineComponent<UseIdleOptions & { timeout: number }>({
+export const UseIdle = /* #__PURE__ */ defineComponent<UseIdleOptions & { timeout: number }>({
   name: 'UseIdle',
   props: ['timeout', 'events', 'listenForVisibilityChange', 'initialState'] as unknown as undefined,
   setup(props, { slots }) {
diff --git a/packages/core/useImage/component.ts b/packages/core/useImage/component.ts
index 15166af7aea..3aadf99c8c2 100644
--- a/packages/core/useImage/component.ts
+++ b/packages/core/useImage/component.ts
@@ -4,7 +4,7 @@ import type { UseImageOptions } from '../useImage'
 
 import type { RenderableComponent } from '../types'
 
-export const UseImage = defineComponent<UseImageOptions & RenderableComponent>({
+export const UseImage = /* #__PURE__ */ defineComponent<UseImageOptions & RenderableComponent>({
   name: 'UseImage',
   props: [
     'src',
diff --git a/packages/core/useMouse/component.ts b/packages/core/useMouse/component.ts
index 207142b68a4..04e7bfcbf36 100644
--- a/packages/core/useMouse/component.ts
+++ b/packages/core/useMouse/component.ts
@@ -2,7 +2,7 @@ import { defineComponent, reactive } from 'vue-demi'
 import type { UseMouseOptions } from '@vueuse/core'
 import { useMouse } from '@vueuse/core'
 
-export const UseMouse = defineComponent<UseMouseOptions>({
+export const UseMouse = /* #__PURE__ */ defineComponent<UseMouseOptions>({
   name: 'UseMouse',
   props: ['touch', 'resetOnTouchEnds', 'initialValue'] as unknown as undefined,
   setup(props, { slots }) {
diff --git a/packages/core/useMouseInElement/component.ts b/packages/core/useMouseInElement/component.ts
index cef1f89a138..021992c904e 100644
--- a/packages/core/useMouseInElement/component.ts
+++ b/packages/core/useMouseInElement/component.ts
@@ -3,7 +3,7 @@ import type { MouseInElementOptions } from '@vueuse/core'
 import { useMouseInElement } from '@vueuse/core'
 import type { RenderableComponent } from '../types'
 
-export const UseMouseInElement = defineComponent<MouseInElementOptions & RenderableComponent>({
+export const UseMouseInElement = /* #__PURE__ */ defineComponent<MouseInElementOptions & RenderableComponent>({
   name: 'UseMouseElement',
   props: ['handleOutside', 'as'] as unknown as undefined,
   setup(props, { slots }) {
diff --git a/packages/core/useMousePressed/component.ts b/packages/core/useMousePressed/component.ts
index 3cba2fac127..010a9fe9748 100644
--- a/packages/core/useMousePressed/component.ts
+++ b/packages/core/useMousePressed/component.ts
@@ -3,7 +3,7 @@ import type { MousePressedOptions } from '@vueuse/core'
 import { useMousePressed } from '@vueuse/core'
 import type { RenderableComponent } from '../types'
 
-export const UseMousePressed = defineComponent<Omit<MousePressedOptions, 'target'> & RenderableComponent>({
+export const UseMousePressed = /* #__PURE__ */ defineComponent<Omit<MousePressedOptions, 'target'> & RenderableComponent>({
   name: 'UseMousePressed',
   props: ['touch', 'initialValue', 'as'] as unknown as undefined,
   setup(props, { slots }) {
diff --git a/packages/core/useNetwork/component.ts b/packages/core/useNetwork/component.ts
index 51820e9b990..247471694d4 100644
--- a/packages/core/useNetwork/component.ts
+++ b/packages/core/useNetwork/component.ts
@@ -1,7 +1,7 @@
 import { defineComponent, reactive } from 'vue-demi'
 import { useNetwork } from '@vueuse/core'
 
-export const UseNetwork = defineComponent({
+export const UseNetwork = /* #__PURE__ */ defineComponent({
   name: 'UseNetwork',
   setup(props, { slots }) {
     const data = reactive(useNetwork())
diff --git a/packages/core/useNow/component.ts b/packages/core/useNow/component.ts
index 7407b8a5f59..0b57b5c26e4 100644
--- a/packages/core/useNow/component.ts
+++ b/packages/core/useNow/component.ts
@@ -2,7 +2,7 @@ import { defineComponent, reactive } from 'vue-demi'
 import type { UseNowOptions } from '@vueuse/core'
 import { useNow } from '@vueuse/core'
 
-export const UseNow = defineComponent<Omit<UseNowOptions<true>, 'controls'>>({
+export const UseNow = /* #__PURE__ */ defineComponent<Omit<UseNowOptions<true>, 'controls'>>({
   name: 'UseNow',
   props: ['interval'] as unknown as undefined,
   setup(props, { slots }) {
diff --git a/packages/core/useObjectUrl/component.ts b/packages/core/useObjectUrl/component.ts
index 135b22fd72f..ce6411f69a0 100644
--- a/packages/core/useObjectUrl/component.ts
+++ b/packages/core/useObjectUrl/component.ts
@@ -5,7 +5,7 @@ export interface UseObjectUrlProps {
   object: Blob | MediaSource | undefined
 }
 
-export const UseObjectUrl = defineComponent<UseObjectUrlProps>({
+export const UseObjectUrl = /* #__PURE__ */ defineComponent<UseObjectUrlProps>({
   name: 'UseObjectUrl',
   props: [
     'object',
diff --git a/packages/core/useOffsetPagination/component.ts b/packages/core/useOffsetPagination/component.ts
index a5da0c62a6b..5c36487cbc5 100644
--- a/packages/core/useOffsetPagination/component.ts
+++ b/packages/core/useOffsetPagination/component.ts
@@ -2,7 +2,7 @@ import { defineComponent, reactive } from 'vue-demi'
 import { useOffsetPagination } from '@vueuse/core'
 import type { UseOffsetPaginationOptions } from '.'
 
-export const UseOffsetPagination = defineComponent<UseOffsetPaginationOptions>({
+export const UseOffsetPagination = /* #__PURE__ */ defineComponent<UseOffsetPaginationOptions>({
   name: 'UseOffsetPagination',
   props: [
     'total',
diff --git a/packages/core/useOnline/component.ts b/packages/core/useOnline/component.ts
index f5249b06cd6..8deafdfe29a 100644
--- a/packages/core/useOnline/component.ts
+++ b/packages/core/useOnline/component.ts
@@ -1,7 +1,7 @@
 import { defineComponent, reactive } from 'vue-demi'
 import { useOnline } from '@vueuse/core'
 
-export const UseOnline = defineComponent({
+export const UseOnline = /* #__PURE__ */ defineComponent({
   name: 'UseOnline',
   setup(props, { slots }) {
     const data = reactive({
diff --git a/packages/core/usePageLeave/component.ts b/packages/core/usePageLeave/component.ts
index 4325a21d8d3..e04e80bf8bf 100644
--- a/packages/core/usePageLeave/component.ts
+++ b/packages/core/usePageLeave/component.ts
@@ -1,7 +1,7 @@
 import { defineComponent, reactive } from 'vue-demi'
 import { usePageLeave } from '@vueuse/core'
 
-export const UsePageLeave = defineComponent({
+export const UsePageLeave = /* #__PURE__ */ defineComponent({
   name: 'UsePageLeave',
   setup(props, { slots }) {
     const data = reactive({
diff --git a/packages/core/usePointer/component.ts b/packages/core/usePointer/component.ts
index ee4533a028e..e93a97c0c9e 100644
--- a/packages/core/usePointer/component.ts
+++ b/packages/core/usePointer/component.ts
@@ -3,7 +3,7 @@ import type { UsePointerOptions } from '@vueuse/core'
 import { usePointer } from '@vueuse/core'
 import { defaultWindow } from '../_configurable'
 
-export const UsePointer = defineComponent<Omit<UsePointerOptions, 'target'> & { target: 'window' | 'self' }>({
+export const UsePointer = /* #__PURE__ */ defineComponent<Omit<UsePointerOptions, 'target'> & { target: 'window' | 'self' }>({
   name: 'UsePointer',
   props: [
     'pointerTypes',
diff --git a/packages/core/usePreferredColorScheme/component.ts b/packages/core/usePreferredColorScheme/component.ts
index 980878fa7d8..de63b806625 100644
--- a/packages/core/usePreferredColorScheme/component.ts
+++ b/packages/core/usePreferredColorScheme/component.ts
@@ -1,7 +1,7 @@
 import { defineComponent, reactive } from 'vue-demi'
 import { usePreferredColorScheme } from '@vueuse/core'
 
-export const UsePreferredColorScheme = defineComponent({
+export const UsePreferredColorScheme = /* #__PURE__ */ defineComponent({
   name: 'UsePreferredColorScheme',
   setup(props, { slots }) {
     const data = reactive({
diff --git a/packages/core/usePreferredContrast/component.ts b/packages/core/usePreferredContrast/component.ts
index afdbdf6364e..ea5d7b255be 100644
--- a/packages/core/usePreferredContrast/component.ts
+++ b/packages/core/usePreferredContrast/component.ts
@@ -1,7 +1,7 @@
 import { defineComponent, reactive } from 'vue-demi'
 import { usePreferredContrast } from '@vueuse/core'
 
-export const UsePreferredContrast = defineComponent({
+export const UsePreferredContrast = /* #__PURE__ */ defineComponent({
   name: 'UsePreferredContrast',
   setup(props, { slots }) {
     const data = reactive({
diff --git a/packages/core/usePreferredDark/component.ts b/packages/core/usePreferredDark/component.ts
index ee2b888d1d2..f281a4bd495 100644
--- a/packages/core/usePreferredDark/component.ts
+++ b/packages/core/usePreferredDark/component.ts
@@ -1,7 +1,7 @@
 import { defineComponent, reactive } from 'vue-demi'
 import { usePreferredDark } from '@vueuse/core'
 
-export const UsePreferredDark = defineComponent({
+export const UsePreferredDark = /* #__PURE__ */ defineComponent({
   name: 'UsePreferredDark',
   setup(props, { slots }) {
     const data = reactive({
diff --git a/packages/core/usePreferredLanguages/component.ts b/packages/core/usePreferredLanguages/component.ts
index e66265b231b..87567819353 100644
--- a/packages/core/usePreferredLanguages/component.ts
+++ b/packages/core/usePreferredLanguages/component.ts
@@ -1,7 +1,7 @@
 import { defineComponent, reactive } from 'vue-demi'
 import { usePreferredLanguages } from '@vueuse/core'
 
-export const UsePreferredLanguages = defineComponent({
+export const UsePreferredLanguages = /* #__PURE__ */ defineComponent({
   name: 'UsePreferredLanguages',
   setup(props, { slots }) {
     const data = reactive({
diff --git a/packages/core/usePreferredReducedMotion/component.ts b/packages/core/usePreferredReducedMotion/component.ts
index 7ca183cf686..37426a09e71 100644
--- a/packages/core/usePreferredReducedMotion/component.ts
+++ b/packages/core/usePreferredReducedMotion/component.ts
@@ -1,7 +1,7 @@
 import { defineComponent, reactive } from 'vue-demi'
 import { usePreferredReducedMotion } from '@vueuse/core'
 
-export const UsePreferredReducedMotion = defineComponent({
+export const UsePreferredReducedMotion = /* #__PURE__ */ defineComponent({
   name: 'UsePreferredReducedMotion',
   setup(props, { slots }) {
     const data = reactive({
diff --git a/packages/core/useScreenSafeArea/component.ts b/packages/core/useScreenSafeArea/component.ts
index 5dd4cbc99f4..c629a365cdf 100644
--- a/packages/core/useScreenSafeArea/component.ts
+++ b/packages/core/useScreenSafeArea/component.ts
@@ -1,7 +1,7 @@
 import { defineComponent, h } from 'vue-demi'
 import { useScreenSafeArea } from '.'
 
-export const UseScreenSafeArea = defineComponent({
+export const UseScreenSafeArea = /* #__PURE__ */ defineComponent({
   name: 'UseScreenSafeArea',
   props: {
     top: Boolean,
diff --git a/packages/core/useTimeAgo/component.ts b/packages/core/useTimeAgo/component.ts
index 6cd033701af..7febaf3816a 100644
--- a/packages/core/useTimeAgo/component.ts
+++ b/packages/core/useTimeAgo/component.ts
@@ -7,7 +7,7 @@ interface UseTimeAgoComponentOptions extends Omit<UseTimeAgoOptions<true>, 'cont
   time: MaybeRef<Date | number | string>
 }
 
-export const UseTimeAgo = defineComponent<UseTimeAgoComponentOptions>({
+export const UseTimeAgo = /* #__PURE__ */ defineComponent<UseTimeAgoComponentOptions>({
   name: 'UseTimeAgo',
   props: ['time', 'updateInterval', 'max', 'fullDateFormatter', 'messages', 'showSecond'] as unknown as undefined,
   setup(props, { slots }) {
diff --git a/packages/core/useTimestamp/component.ts b/packages/core/useTimestamp/component.ts
index 3d5160031c6..87de12d907c 100644
--- a/packages/core/useTimestamp/component.ts
+++ b/packages/core/useTimestamp/component.ts
@@ -2,7 +2,7 @@ import { defineComponent, reactive } from 'vue-demi'
 import type { UseTimestampOptions } from '@vueuse/core'
 import { useTimestamp } from '@vueuse/core'
 
-export const UseTimestamp = defineComponent<Omit<UseTimestampOptions<true>, 'controls'>>({
+export const UseTimestamp = /* #__PURE__ */ defineComponent<Omit<UseTimestampOptions<true>, 'controls'>>({
   name: 'UseTimestamp',
   props: ['immediate', 'interval', 'offset'] as unknown as undefined,
   setup(props, { slots }) {
diff --git a/packages/core/useVirtualList/component.ts b/packages/core/useVirtualList/component.ts
index cff91d5eaa6..0a78f6ecef0 100644
--- a/packages/core/useVirtualList/component.ts
+++ b/packages/core/useVirtualList/component.ts
@@ -23,7 +23,7 @@ export interface UseVirtualListProps {
   height: string
 }
 
-export const UseVirtualList = defineComponent<UseVirtualListProps>({
+export const UseVirtualList = /* #__PURE__ */ defineComponent<UseVirtualListProps>({
   name: 'UseVirtualList',
   props: [
     'list',
diff --git a/packages/core/useWindowFocus/component.ts b/packages/core/useWindowFocus/component.ts
index 8439e6d2453..0fd40c67729 100644
--- a/packages/core/useWindowFocus/component.ts
+++ b/packages/core/useWindowFocus/component.ts
@@ -1,7 +1,7 @@
 import { defineComponent, reactive } from 'vue-demi'
 import { useWindowFocus } from '@vueuse/core'
 
-export const UseWindowFocus = defineComponent({
+export const UseWindowFocus = /* #__PURE__ */ defineComponent({
   name: 'UseWindowFocus',
   setup(props, { slots }) {
     const data = reactive({
diff --git a/packages/core/useWindowSize/component.ts b/packages/core/useWindowSize/component.ts
index 039baf14d2a..636e344aa25 100644
--- a/packages/core/useWindowSize/component.ts
+++ b/packages/core/useWindowSize/component.ts
@@ -2,7 +2,7 @@ import { defineComponent, reactive } from 'vue-demi'
 import type { UseWindowSizeOptions } from '@vueuse/core'
 import { useWindowSize } from '@vueuse/core'
 
-export const UseWindowSize = defineComponent<UseWindowSizeOptions>({
+export const UseWindowSize = /* #__PURE__ */ defineComponent<UseWindowSizeOptions>({
   name: 'UseWindowSize',
   props: ['initialWidth', 'initialHeight'] as unknown as undefined,
   setup(props, { slots }) {
diff --git a/packages/integrations/useAsyncValidator/component.ts b/packages/integrations/useAsyncValidator/component.ts
index 82db5fc839c..326af3280cd 100644
--- a/packages/integrations/useAsyncValidator/component.ts
+++ b/packages/integrations/useAsyncValidator/component.ts
@@ -3,7 +3,7 @@ import { defineComponent, reactive } from 'vue-demi'
 import type { Rules } from 'async-validator'
 import { useAsyncValidator } from '.'
 
-export const UseAsyncValidator = defineComponent({
+export const UseAsyncValidator = /* #__PURE__ */ defineComponent({
   name: 'UseAsyncValidator',
   props: {
     form: {
diff --git a/packages/integrations/useFocusTrap/component.ts b/packages/integrations/useFocusTrap/component.ts
index 31b204b114b..b9c0c37a327 100644
--- a/packages/integrations/useFocusTrap/component.ts
+++ b/packages/integrations/useFocusTrap/component.ts
@@ -9,7 +9,7 @@ export interface ComponentUseFocusTrapOptions extends RenderableComponent {
   options?: UseFocusTrapOptions
 }
 
-export const UseFocusTrap = defineComponent <ComponentUseFocusTrapOptions> ({
+export const UseFocusTrap = /* #__PURE__ */ defineComponent <ComponentUseFocusTrapOptions> ({
   name: 'UseFocusTrap',
   props: ['as', 'options'] as unknown as undefined,
   setup(props, { slots }) {