Browser
One script tag, zero bundler config. Drop it into the <head> of your HTML and
nreactive captures runtime errors, unhandled rejections, resource load
failures, long tasks, and CSP violations the moment the page loads.
AI-assisted setup
Paste the prompt below into Claude Code, Cursor, Copilot, or Codex — your agent will locate the right HTML entry point, inject the script tag, and flag any CSP you need to update.
You are adding the nreactive browser integration to this project. nreactive is a production error-monitoring service that opens AI-generated pull requests to fix the errors it catches. The browser integration is a single script tag that captures runtime errors, unhandled rejections, resource load failures, and CSP violations. Do the following: 1. Locate the project's primary HTML entry point. Check in this order: - A root "index.html" (plain HTML, Vite, CRA). - "public/index.html" (older CRA layouts). - An "app/layout.tsx" or "pages/_document.tsx" (Next.js). - A "src/app.html" (SvelteKit) or equivalent. 2. Inject the following inside the <head> so the script loads before application code runs: <script src="https://nreactive.com/integration.js" data-app-id="YOUR_APP_ID"></script> Replace YOUR_APP_ID with a placeholder such as "REPLACE_WITH_NREACTIVE_APP_ID" and leave a comment pointing the user to https://nreactive.com/dashboard/apps to obtain it. 3. If the project uses a framework that discourages third-party scripts in raw HTML (Next.js app router, Remix, SvelteKit), use the framework's script component instead: - Next.js app router: use <Script src="..." strategy="beforeInteractive" /> from "next/script" inside "app/layout.tsx". - Remix: add it to the root route's <Scripts /> block. 4. Do not modify any existing error handlers, service workers, or CSP policies. If a CSP header is in use, instruct the user to allow "https://nreactive.com" in "script-src" and "connect-src". 5. Do not add a build step or npm package — the integration is a single <script> tag. Stop and ask if you cannot locate an HTML entry point or if the project is a Node-only service (no browser surface). In that case, recommend @nreactive/core instead.
Manual setup
Get your App ID
Sign in and grab your App ID from the Apps page. It looks
like app_ab12cd34ef. You'll paste it into the data-app-id attribute of
the script tag.
Add the script tag
Place it inside <head> so it loads before your application code runs:
<script src="https://nreactive.com/integration.js" data-app-id="YOUR_APP_ID"></script>Next.js App Router? Use next/script inside app/layout.tsx instead:
import Script from "next/script";
export default function RootLayout({ children }) {
return (
<html>
<head>
<Script
src="https://nreactive.com/integration.js"
strategy="beforeInteractive"
data-app-id="YOUR_APP_ID"
/>
</head>
<body>{children}</body>
</html>
);
}Check your CSP (if you have one)
If your site sends a Content-Security-Policy header, allow nreactive in
both script-src and connect-src:
script-src 'self' https://nreactive.com;
connect-src 'self' https://nreactive.com;No CSP? Skip this step.
Verify
Load the page, open DevTools, and run:
throw new Error("nreactive test error");Within a few seconds the event shows up on the Errors page of your dashboard. You're done.