Remix Setup | Errova Docs

Use @errova/sdk-remix for Remix apps. Prefer the framework-specific subpaths so server files never need to import client-only code and route error boundaries stay in React-only modules.

Bash

npm install @errova/sdk-remix

1. Initialize Browser Capture in entry.client

TSX

import { RemixBrowser } from "@remix-run/react"
import { hydrateRoot } from "react-dom/client"

import { init } from "@errova/sdk-remix"

const browserEnv = (typeof window !== "undefined" ? window.ENV : undefined) ?? {}
const dsn = typeof browserEnv.ERROVA_DSN === "string" ? browserEnv.ERROVA_DSN : ""

if (dsn) {
  init({
    dsn,
    environment:
      typeof browserEnv.NODE_ENV === "string" ? browserEnv.NODE_ENV : "development",
    release:
      typeof browserEnv.APP_VERSION === "string"
        ? browserEnv.APP_VERSION
        : "my-remix-app@local",
  })
}

hydrateRoot(document, <RemixBrowser />)

2. Capture Server Errors and Route Failures

TypeScript

import {
  handleError as captureRemixHandleError,
  withRemixErrorCapture,
} from "@errova/sdk-remix/server"

export function handleError(error, { request, params, context }) {
  captureRemixHandleError(error, {
    request,
    params,
    context,
    routeId: "entry.server",
  })
}

export const loader = withRemixErrorCapture(async ({ request, params }) => {
  throw new Error(
    `Failed loading route for ${request.url} with params ${JSON.stringify(params)}`
  )
})

Important Notes

Use @errova/sdk-remix/server for loaders, actions, and entry.server.
Use @errova/sdk-remix/react for route-level ErrorBoundary capture.
Keep signed DSN secrets server-only.
This package is beta tier, so test both browser and server failure paths before rollout.