Zengtudor/Nuxt
1
0
Fork 0
mirror of https://github.com/nuxt/nuxt.git synced 2025-03-20 08:15:59 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(nuxt): add missing lazy hydration prop in regex (#31359)

Browse Source
This commit is contained in:
Julien Huang 2025-03-17 18:53:51 +01:00 committed by GitHub
parent 757641a7ea
commit 6b35a08c32
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 19 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
packages/nuxt/src/components/plugins/lazy-hydration-transform.ts
View File

@ -23,7 +23,7 @@ const hydrationStrategyMap = {
hydrateWhen: 'If',
hydrateNever: 'Never',
}
const LAZY_HYDRATION_PROPS_RE = /\bhydrate-?on-?idle|hydrate-?on-?visible|hydrate-?on-?interaction|hydrate-?on-?media-?query|hydrate-?after|hydrate-?when\b/
const LAZY_HYDRATION_PROPS_RE = /\bhydrate-?on-?idle|hydrate-?on-?visible|hydrate-?on-?interaction|hydrate-?on-?media-?query|hydrate-?after|hydrate-?when|hydrate-?never\b/
export const LazyHydrationTransformPlugin = (options: LoaderOptions) => createUnplugin(() => {
const exclude = options.transform?.exclude || []
const include = options.transform?.include || []

18
packages/nuxt/test/component-loader.test.ts
View File

@ -121,6 +121,24 @@ describe('components:loader', () => {
const __nuxt_component_0_lazy_never = createLazyNeverComponent("components/MyComponent.vue", () => import('../components/MyComponent.vue').then(c => c.default || c));"
`)
})
it.each([
['hydrate-on-idle', 'createLazyIdleComponent'],
['hydrate-on-visible', 'createLazyVisibleComponent'],
['hydrate-on-interaction', 'createLazyInteractionComponent'],
['hydrate-on-media-query', 'createLazyMediaQueryComponent'],
['hydrate-after', 'createLazyTimeComponent'],
['hydrate-when', 'createLazyIfComponent'],
['hydrate-never', 'createLazyNeverComponent'],
])('should correctly resolve lazy hydration components %s', async (prop, component) => {
const sfc = `
<template>
<LazyMyComponent ${prop} />
</template>
`
const result = await transform(sfc, '/pages/index.vue').then(r => r.split('\n'))
expect(result.join('\n')).toContain(component)
})
})
async function transform (code: string, filename: string) {