Skip to main content

Overview

The @infinitewatch/vue SDK provides a Vue plugin that integrates session recording into your Vue app.

Step 1: Installation

npm install @infinitewatch/vue

Step 2: Environment Variables

Add to your .env file:
VITE_INFINITEWATCH_ORG_ID=YOUR_ORGANIZATION_ID
Replace YOUR_ORGANIZATION_ID with your actual organization ID. You can find this in your InfiniteWatch dashboard.

Step 3: Basic Setup

Register the plugin in your main entry file (e.g. main.ts):
import { createApp } from 'vue';
import { InfiniteWatchPlugin } from '@infinitewatch/vue';
import App from './App.vue';

const app = createApp(App);

app.use(InfiniteWatchPlugin, {
  organizationId: import.meta.env.VITE_INFINITEWATCH_ORG_ID,
});

app.mount('#app');

Identify Users

After the plugin is set up, you can associate sessions with specific users:
InfiniteWatch.identify({
  external_id: 'user-12345',
  email: 'user@example.com',
  full_name: 'John Doe',
  metadata: {
    plan: 'premium',
    signup_date: '2024-01-15'
  }
});
Call identify() after the user logs in. The external_id is persisted in a cookie so it carries across page reloads and sessions.