Overview:
Svelte Error Boundary is a package that provides a simple error boundary component for Svelte. It can be used with both DOM and SSR targets. The package includes a default error boundary component that has an optional onError callback to log errors to services like Sentry. It also offers a createBoundary function that allows monkey-patching of existing Svelte components to create custom error state UIs. However, it should be noted that monkey-patching may break in future versions of Svelte, so this package is intended as a temporary solution for current production use of Svelte.
Features:
- Error Boundary Component: Provides a simple error boundary component for Svelte.
- Target Compatibility: Can be used with both DOM and SSR targets.
- onError Callback: Optional callback function for logging errors to external services.
- createBoundary Function: Allows monkey-patching of existing Svelte components to create custom error state UIs.
- Temporary Solution: Intended as a stop-gap solution for current production use of Svelte.
Installation:
To install Svelte Error Boundary, you can follow these steps:
- Install the package using npm or yarn:
npm install svelte-error-boundary
or
yarn add svelte-error-boundary
- Import the default error boundary component:
import { ErrorBoundary } from 'svelte-error-boundary';
- Use the error boundary component in your Svelte template:
<ErrorBoundary>
<!-- Your Svelte component code here -->
</ErrorBoundary>
- Optionally, you can provide an onError callback function:
<ErrorBoundary onError={handleError}>
<!-- Your Svelte component code here -->
</ErrorBoundary>
- If you want to create custom error state UIs, you can use the createBoundary function:
import { createBoundary } from 'svelte-error-boundary';
import MyComponent from './MyComponent.svelte';
const ErrorBoundaryMyComponent = createBoundary(MyComponent);
Summary:
Svelte Error Boundary is a package that provides a simple error boundary component for Svelte. It can be used with both DOM and SSR targets and offers an optional onError callback for logging errors. It also includes a createBoundary function for creating custom error state UIs. However, it should be noted that this package is intended as a temporary solution for current production use of Svelte, as monkey-patching may break in future versions of the framework.