Using Spotlight with Remix

Install Sentry & Spotlight

Follow the Remix Getting Started guide on Sentry, and continue from there.

Note

This guide is focused on Remix without Vite. It needs Vite added to the documentation, but the steps should be similar.

npm

npm add @spotlightjs/spotlight

pnpm

pnpm add @spotlightjs/spotlight

yarn

yarn add @spotlightjs/spotlight

Initialize Spotlight within entry.client.js, after you’ve hydrated the document:

startTransition(() => {
  hydrateRoot(document, <RemixBrowser />);
});

if (process.env.NODE_ENV === "development") {
  import("@spotlightjs/spotlight").then((Spotlight) =>
    Spotlight.init({ injectImmediately: true }),
  );
}