Skip to main content
Prefetching component downloads the code in the background, this is based on the assumption that the component will likely be used for rendering, enabling the component to load instantly if and when the user requests it. The component is downloaded and cached for anticipated future use without the user making an explicit request for it. Use prefetchComponents to manually prefetch individual components that have been registered globally in your Nuxt app. By default Nuxt registers these as async components. You must use the Pascal-cased version of the component name.

Type Signature

function prefetchComponents(components: string | string[]): Promise<void>

Parameters

components
string | string[]
required
Component name(s) to prefetch. Can be a single component name string or an array of component names. Must use Pascal-case naming.

Examples

Prefetch a Single Component

await prefetchComponents('MyGlobalComponent')

Prefetch Multiple Components

await prefetchComponents(['MyGlobalComponent1', 'MyGlobalComponent2'])

Notes

Current implementation behaves exactly the same as preloadComponents by preloading components instead of just prefetching. We are working to improve this behavior.
On server, prefetchComponents will have no effect.

See Also