refactor(nuxt): don't wrap server placeholders/client fallbacks (#21980)

This commit is contained in:
Julien Huang 2023-09-13 23:56:15 +02:00 committed by GitHub
parent 084b2b0974
commit 95d1f9944d
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 12 additions and 2 deletions

View File

@ -48,7 +48,7 @@ export const loaderPlugin = createUnplugin((options: LoaderOptions) => {
let identifier = map.get(component) || `__nuxt_component_${num++}` let identifier = map.get(component) || `__nuxt_component_${num++}`
map.set(component, identifier) map.set(component, identifier)
const isServerOnly = component.mode === 'server' && const isServerOnly = !component._raw && component.mode === 'server' &&
!components.some(c => c.pascalName === component.pascalName && c.mode === 'client') !components.some(c => c.pascalName === component.pascalName && c.mode === 'client')
if (isServerOnly) { if (isServerOnly) {
imports.add(genImport(serverComponentRuntime, [{ name: 'createServerComponent' }])) imports.add(genImport(serverComponentRuntime, [{ name: 'createServerComponent' }]))
@ -59,7 +59,7 @@ export const loaderPlugin = createUnplugin((options: LoaderOptions) => {
return identifier return identifier
} }
const isClientOnly = component.mode === 'client' && component.pascalName !== 'NuxtClientFallback' const isClientOnly = !component._raw && component.mode === 'client'
if (isClientOnly) { if (isClientOnly) {
imports.add(genImport('#app/components/client-only', [{ name: 'createClientOnly' }])) imports.add(genImport('#app/components/client-only', [{ name: 'createClientOnly' }]))
identifier += '_client' identifier += '_client'

View File

@ -170,6 +170,7 @@ export default defineNuxtModule<ComponentsOptions>({
if (component.mode === 'client' && !newComponents.some(c => c.pascalName === component.pascalName && c.mode === 'server')) { if (component.mode === 'client' && !newComponents.some(c => c.pascalName === component.pascalName && c.mode === 'server')) {
newComponents.push({ newComponents.push({
...component, ...component,
_raw: true,
mode: 'server', mode: 'server',
filePath: resolve(distDir, 'app/components/server-placeholder'), filePath: resolve(distDir, 'app/components/server-placeholder'),
chunkName: 'components/' + component.kebabName chunkName: 'components/' + component.kebabName

View File

@ -265,6 +265,7 @@ async function initNuxt (nuxt: Nuxt) {
if (nuxt.options.experimental.clientFallback) { if (nuxt.options.experimental.clientFallback) {
addComponent({ addComponent({
name: 'NuxtClientFallback', name: 'NuxtClientFallback',
_raw: true,
priority: 10, // built-in that we do not expect the user to override priority: 10, // built-in that we do not expect the user to override
filePath: resolve(nuxt.options.appDir, 'components/client-fallback.client'), filePath: resolve(nuxt.options.appDir, 'components/client-fallback.client'),
mode: 'client' mode: 'client'
@ -272,6 +273,7 @@ async function initNuxt (nuxt: Nuxt) {
addComponent({ addComponent({
name: 'NuxtClientFallback', name: 'NuxtClientFallback',
_raw: true,
priority: 10, // built-in that we do not expect the user to override priority: 10, // built-in that we do not expect the user to override
filePath: resolve(nuxt.options.appDir, 'components/client-fallback.server'), filePath: resolve(nuxt.options.appDir, 'components/client-fallback.server'),
mode: 'server' mode: 'server'

View File

@ -16,6 +16,13 @@ export interface Component {
* components will be used instead of lower priority components. * components will be used instead of lower priority components.
*/ */
priority?: number priority?: number
/**
* Allow bypassing client/server transforms for internal Nuxt components like
* ServerPlaceholder and NuxtClientFallback.
*
* @internal
*/
_raw?: boolean
} }
export interface ScanDir { export interface ScanDir {