Error Boundary Kit
Production-ready error boundaries for Vue 3 — a declarative component, a composable for programmatic use, and an adapter-based reporting layer.
Declarative ErrorBoundary component
Wrap any part of your app in <ErrorBoundary> with a fallback slot for error display. Control state via resetKeys, maxRetries, and auto-reset on prop changes. Access error, reset/retry methods, and retry count both in the slot and via a template ref.
Programmatic capture and global monitoring
Use useErrorBoundary() to manually register errors from any code — e.g., when parsing JSON or in event handlers. And with useGlobalErrorCapture(), catch unhandled errors and promise rejections that Vue cannot see.
Flexible reporting system with adapters
Send errors to Sentry, Bugsnag, LogRocket, an HTTP endpoint, or the console via pluggable adapters. Each adapter is a separate entry point, not bloating the main bundle. Built‑in rate limiting and breadcrumbs protect against spam and provide context.
Ready-to-use integration with Nuxt, vue-router, and TanStack Query
The Nuxt module auto-registers the component and utilities. useNuxtErrorBoundary() catches app‑level errors, while useRouterErrorBoundary() catches navigation and async route errors. For TanStack Query, a dedicated hook resets errored queries.
AsyncBoundary, error history, and SSR safety
AsyncBoundary combines Suspense and ErrorBoundary with a unified API and loading/fallback slots. For debugging, use the error history and a devtools panel. All components are SSR‑safe — render errors never crash the server, and hydration always converges to the correct state.