Vue 3

npm install @tracelit/tracker

Call init() before mounting your app in main.ts:

// src/main.ts
import { createApp } from 'vue'
import { init } from '@tracelit/tracker'
import App from './App.vue'

init({ token: 'YOUR_TOKEN_HERE', environment: 'production' })
createApp(App).mount('#app')

Always set environment. Only "production" and "development" are accepted. If omitted, events default to development.

Tracelit detects route changes automatically via history.pushState — Vue Router works out of the box with no extra config.

Adding user identity

Call identify() after your auth state resolves — for example, inside a composable or watcher:

// composables/useTracelitIdentity.ts
import { watch } from 'vue'
import { identify, reset } from '@tracelit/tracker'
import { useAuth } from '@/composables/useAuth'

export function useTracelitIdentity() {
  const { user } = useAuth()

  watch(user, (u) => {
    if (u) identify(u.id, { email: u.email, plan: u.plan })
    else reset()
  }, { immediate: true })
}

Then call it in your root App.vue:

<!-- App.vue -->
<script setup>
import { useTracelitIdentity } from '@/composables/useTracelitIdentity'
useTracelitIdentity()
</script>

<template>
  <RouterView />
</template>

LLM Prompt

Paste this into your coding assistant to install Tracelit for you:

Install Tracelit in my Vue 3 project.
Use @tracelit/tracker and initialize it in src/main.ts with:
init({ token: 'YOUR_TOKEN_HERE', environment: 'production' })
Keep edits minimal, list changed files, and provide a quick verify checklist.

What’s next?

Topic	Description	Guide
Identify users	Full guide to linking sessions to real users.	Read
Feature tagging	Tag flows in session replays.	Read

Frontend

Backend

Adding user identity

LLM Prompt

What’s next?

​Adding user identity

​LLM Prompt

​What’s next?

Adding user identity

LLM Prompt

What’s next?