Nuxt

Use a client-only Nuxt plugin. The .client suffix keeps browser initialization out of server rendering.

Initialize Tracwell

app/plugins/tracwell.client.ts

import { createTracwell } from "tracwell";

export default defineNuxtPlugin(() => {
  const analytics = createTracwell({
    collectionMode: "product",
    projectKey: "tw_live_...",
  });

  return {
    provide: { tracwell: analytics },
  };
});

Access the client as $tracwell in Nuxt code. Standard Nuxt navigation is tracked automatically.

Track an event

Keep the initialized client available to the components or services that own successful product outcomes, then call track() after the outcome completes.

TypeScript

const eventId = analytics.track("signup_completed", {
  plan: "starter",
  source: "pricing",
});

if (!eventId) {
  // Collection is blocked or the event did not pass validation.
}

Continue with the custom events guide for naming, property limits, and verification.