Documentation
IntegrationFramework Guides

Framework Guides

First, install the SDK:

npm install @noisegate/sdk

Next.js

Create or update sentry.client.config.ts:

import * as Sentry from "@sentry/nextjs";
import { initNoisegate, isNoise } from "@noisegate/sdk";

initNoisegate({ apiKey: process.env.NEXT_PUBLIC_NOISEGATE_API_KEY! });

Sentry.init({
  dsn: process.env.NEXT_PUBLIC_SENTRY_DSN,
  beforeSend: (event, hint) => {
    const error = hint?.originalException;
    if (error instanceof Error && isNoise(error)) return null;
    return event;
  },
});

Add to .env.local:

NEXT_PUBLIC_NOISEGATE_API_KEY=ng_live_xxxxxxxxxxxx

React

// src/sentry.ts
import * as Sentry from "@sentry/react";
import { initNoisegate, isNoise } from "@noisegate/sdk";

initNoisegate({ apiKey: import.meta.env.VITE_NOISEGATE_API_KEY });

export function initSentry() {
  Sentry.init({
    dsn: import.meta.env.VITE_SENTRY_DSN,
    integrations: [Sentry.browserTracingIntegration()],
    beforeSend: (event, hint) => {
      const error = hint?.originalException;
      if (error instanceof Error && isNoise(error)) return null;
      return event;
    },
  });
}

Vue

// src/plugins/sentry.ts
import * as Sentry from "@sentry/vue";
import { initNoisegate, isNoise } from "@noisegate/sdk";
import type { App } from "vue";

initNoisegate({ apiKey: import.meta.env.VITE_NOISEGATE_API_KEY });

export function initSentry(app: App) {
  Sentry.init({
    app,
    dsn: import.meta.env.VITE_SENTRY_DSN,
    beforeSend: (event, hint) => {
      const error = hint?.originalException;
      if (error instanceof Error && isNoise(error)) return null;
      return event;
    },
  });
}

Environment Variables

FrameworkVariable
Next.jsNEXT_PUBLIC_NOISEGATE_API_KEY
React (Vite)VITE_NOISEGATE_API_KEY
Vue (Vite)VITE_NOISEGATE_API_KEY

Next Steps