Getting Started
What Nuxt Skeletonizer is and how to add it to your app in under a minute.
Getting Started
Nuxt Skeletonizer generates skeleton loading states automatically from your existing markup — no duplicated "skeleton" components, and no layout shift when the real content arrives.
<Skeletonizer :enabled="pending">
<UserProfile />
</Skeletonizer>
When enabled is true, the module scans the rendered subtree, classifies each element (text,
image, avatar, button, input, …) and paints a placeholder bone in its place — while keeping the
exact same layout.
Why use it?
- No duplicated components — skeletons are derived from the real DOM.
- Zero layout shift — elements are styled in place, never removed.
- Minimal app code — usually a single wrapper or a global toggle.