diff --git a/packages/nuxt/src/app/components/client-only.ts b/packages/nuxt/src/app/components/client-only.ts
index b74e050c30..a526347122 100644
--- a/packages/nuxt/src/app/components/client-only.ts
+++ b/packages/nuxt/src/app/components/client-only.ts
@@ -1,5 +1,6 @@
 import { cloneVNode, createElementBlock, createStaticVNode, defineComponent, getCurrentInstance, h, onMounted, provide, ref } from 'vue'
 import type { ComponentInternalInstance, ComponentOptions, InjectionKey } from 'vue'
+import { useNuxtApp } from '../nuxt'
 import { getFragmentHTML } from './utils'
 
 export const clientOnlySymbol: InjectionKey<boolean> = Symbol.for('nuxt:client-only')
@@ -12,6 +13,12 @@ export default defineComponent({
   setup (_, { slots, attrs }) {
     const mounted = ref(false)
     onMounted(() => { mounted.value = true })
+    // Bail out of checking for pages/layouts as they might be included under `<ClientOnly>` 🤷‍♂️
+    if (import.meta.dev) {
+      const nuxtApp = useNuxtApp()
+      nuxtApp._isNuxtPageUsed = true
+      nuxtApp._isNuxtLayoutUsed = true
+    }
     provide(clientOnlySymbol, true)
     return (props: any) => {
       if (mounted.value) { return slots.default?.() }
@@ -63,7 +70,7 @@ export function createClientOnly<T extends ComponentOptions> (component: T) {
     // remove existing directives during hydration
     const directives = extractDirectives(instance)
     // prevent attrs inheritance since a staticVNode is rendered before hydration
-    for(const key in attrs) {
+    for (const key in attrs) {
       delete instance.attrs[key]
     }
     const mounted$ = ref(false)