Skip to Content
SourcesTracking SDKNuxt

Nuxt 3

Add Vendo tracking to your Nuxt 3 app with a client-side plugin.

Plugin Setup

Create a plugin file with the .client.ts suffix so it only runs in the browser:

// plugins/vendo-tracking.client.ts
export default defineNuxtPlugin(() => {
  const w = window as any;
  w['VendoObject'] = 'vendo';
  w.vendo = w.vendo || function() {
    (w.vendo.q = w.vendo.q || []).push(arguments);
  };
  w.vendo.l = Date.now();
 
  const s = document.createElement('script');
  s.async = true;
  s.src = 'https://cdn.vendodata.com/sdk/v1/vendo.js';
  document.head.appendChild(s);
 
  w.vendo('init', 'YOUR_WRITE_KEY', {
    host: 'https://YOUR_TRACKING_ENDPOINT',
    trackPageViews: true,
  });
 
  // Track client-side navigations
  const router = useRouter();
  router.afterEach(() => {
    if (typeof w.vendo === 'function') {
      w.vendo('page');
    }
  });
});

That’s it. Nuxt auto-registers plugins from the plugins/ directory. The .client.ts suffix ensures it only runs in the browser.

Identify Users

Call identify once the user is authenticated:

window.vendo('identify', user.id, {
  email: user.email,
  name: user.name,
  plan: user.plan,
});

Call reset on logout to clear the identity:

window.vendo('reset');
  • JavaScript SDK — Full method reference and configuration options
  • Vue — Vue 3 plugin setup (Nuxt builds on Vue)
  • Quickstart — Get started in 5 minutes
Last updated on
VueAPI Reference