refactor(nuxt): don't wrap server placeholders/client fallbacks #21980
Conversation
|
|
packages/nuxt/src/core/nuxt.ts
Outdated
| @@ -251,7 +251,8 @@ async function initNuxt (nuxt: Nuxt) { | |||
| name: 'NuxtClientFallback', | |||
| priority: 10, // built-in that we do not expect the user to override | |||
| filePath: resolve(nuxt.options.appDir, 'components/client-fallback.client'), | |||
| mode: 'client' | |||
| mode: 'client', | |||
| noClientOnlyTransform: true | |||
There was a problem hiding this comment.
Is there a better naming for this ?
There was a problem hiding this comment.
raw might be confusing since vue has markRaw which you might use on a component https://vuejs.org/api/reactivity-advanced.html#markraw
There was a problem hiding this comment.
oh i'd prefer raw over prewrapped 😅
| /** | ||
| * This prevent the component to be transformed with a `createClientOnly()` client-side if the mode is `client` | ||
| * An example is the `<NuxtClientFallback>` component which handles it's hydration client-side | ||
| */ | ||
| noClientOnlyTransform?: boolean |
There was a problem hiding this comment.
I would consider using this internally for NuxtClientFallback to test before making it a public property. Or do you think it's a common enough use-case that we need an API for it?
There was a problem hiding this comment.
I'm not sure about that 🤔 I guess we'd need to know if some users need it. It's mainly a way to keep side-effects modules only on 1 side (server or client).
There was a problem hiding this comment.
I'd be happy to merge an fix needing this with an internal property that we set and consume for <NuxtClientFallback>, rather than exposing this as a public property for components which can be enabled by users ...
There was a problem hiding this comment.
let's mark it private for now 👍
i think @internal should be enough to hide it ? 🤔
danielroe
changed the title
noClientOnlyTransform to ComponentNuxtClientFallback as raw
danielroe
changed the title
NuxtClientFallback as raw
🔗 Linked issue
❓ Type of change
📚 Description
Hi 👋
This PR adds a small feature which i don't think will be used by many.
noClientOnlyTransformwill prevent a client-side component to be wrapped within acreateClientOnly.As i'm currently working on a server components rework, this may be used (not a 100% sure) but it can be good to have this option as
NuxtClientFallbackwill be using this instead of hard-coding the prevent behavior.This can also be needed for some very advanced usages from modules author to avoid having some server code within client bundle due to possible side-effects (
vue/server-rendererwithNuxtClientFallback) by having a .server and .client component.📝 Checklist