Troubleshooting
Troubleshooting
An <img> still shows its picture
Make sure the image is inside an active <Skeletonizer>. The engine hides the real content
(visibility: hidden) under the SVG overlay, so the picture should disappear behind its bone.
<canvas> / <video> content elements are a known edge case for measurement — use
v-skeleton-replace="'image'" or a <SkeletonImage> for those.
My custom widget isn't skeletonized correctly
Use v-skeleton-replace="'<kind>'" to force a bone kind, or v-skeleton-union to collapse the
widget into a single bone.
The skeleton flashes on first paint
The engine runs after hydration by design. Bind :enabled to your loading state so it only
activates while data is pending. For above-the-fold SSR placeholders, use the manual Skeleton*
primitives, which are server-rendered.
Nothing happens
- Confirm
skeletonizer.enabledisn'tfalseglobally (or calluseSkeletonizer().enable()). - Confirm the subtree is actually inside a
<Skeletonizer>. - If you set
autoScan: false, the engine won't scan automatically — callrefresh()yourself.
Content added later isn't skeletonized
The MutationObserver re-scans automatically, but if nodes were added by code outside Vue's
reactivity, call useSkeletonizer().refresh() after the change.
Colors don't match my theme
The defaults are neutral grays. Override baseColor / highlightColor in config, via setTheme(),
or by setting the --sk-* CSS variables. See Theming.
TypeScript can't find the components/composables
Run nuxi prepare to regenerate types, and ensure nuxt-skeletonizer is listed in modules.
Still stuck? Open an issue.