Svelte Error Boundary

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:

1. Install the package using npm or yarn:

npm install svelte-error-boundary

or

yarn add svelte-error-boundary

2. Import the default error boundary component:

import { ErrorBoundary } from 'svelte-error-boundary';

3. Use the error boundary component in your Svelte template:

<ErrorBoundary>
  <!-- Your Svelte component code here -->
</ErrorBoundary>

4. Optionally, you can provide an onError callback function:

<ErrorBoundary onError={handleError}>
  <!-- Your Svelte component code here -->
</ErrorBoundary>

5. 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.