fix(nuxt): don't check for layout/page with <ClientOnly> (#25714)

This commit is contained in:
Daniel Roe 2024-02-09 20:33:35 +00:00 committed by GitHub
parent 3c271413f8
commit fd671a27ea
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -1,5 +1,6 @@
import { cloneVNode, createElementBlock, createStaticVNode, defineComponent, getCurrentInstance, h, onMounted, provide, ref } from 'vue' import { cloneVNode, createElementBlock, createStaticVNode, defineComponent, getCurrentInstance, h, onMounted, provide, ref } from 'vue'
import type { ComponentInternalInstance, ComponentOptions, InjectionKey } from 'vue' import type { ComponentInternalInstance, ComponentOptions, InjectionKey } from 'vue'
import { useNuxtApp } from '../nuxt'
import { getFragmentHTML } from './utils' import { getFragmentHTML } from './utils'
export const clientOnlySymbol: InjectionKey<boolean> = Symbol.for('nuxt:client-only') export const clientOnlySymbol: InjectionKey<boolean> = Symbol.for('nuxt:client-only')
@ -12,6 +13,12 @@ export default defineComponent({
setup (_, { slots, attrs }) { setup (_, { slots, attrs }) {
const mounted = ref(false) const mounted = ref(false)
onMounted(() => { mounted.value = true }) 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) provide(clientOnlySymbol, true)
return (props: any) => { return (props: any) => {
if (mounted.value) { return slots.default?.() } if (mounted.value) { return slots.default?.() }