AppSignal für Browser installieren

import { init } from "@appsignal/browser";

const IGNORED = [
  /ResizeObserver loop/,
  /^Script error\.?$/,
  /-extension:\/\//,
  /webkit-masked-url/,
];

init({
  key: "<YOUR_FRONTEND_API_KEY>",
  endpoint: "https://appsignal-endpoint.net",
  // Inactive builds send nothing. Replace these with your build values.
  active: process.env.NODE_ENV === "production",
  appVersion: process.env.APP_REVISION,
  // Match your API host and path.
  tracePropagationTargets: ["api.example.com/**"],
  privacy: {
    // Mask text or exclude clicks on these elements.
    dom: { maskText: [".user-email"], blockElement: ["#card-form"] },
  },
  beforeError: (error) => {
    const text = [error.message, error.stack, error.filename].join(" ");
    return IGNORED.some((pattern) => pattern.test(text)) ? null : error;
  },
});

import "./appsignal";

// Start your React application after this import.

import { useEffect } from "react";
import { setRouteTemplate } from "@appsignal/browser";

export function RouteReporter({ routePattern }) {
  useEffect(() => {
    setRouteTemplate(routePattern); // "/users/:id", not "/users/42"
  }, [routePattern]);

  return null;
}

import { setTags } from "@appsignal/browser";

setTags({ plan: "pro", tenant: "acme" });

import { captureError } from "@appsignal/browser";
import { ErrorBoundary } from "@appsignal/browser/react";

<ErrorBoundary
  captureError={captureError}
  fallback={<p>This page didn't load. Reload to try again.</p>}
>
  <App />
</ErrorBoundary>

import { captureError } from "@appsignal/browser";

try {
  save();
} catch (error) {
  captureError(error);
}