Add Vident to Vue

Set up error tracking, session replay, and Web Vitals in Vue 3 applications with Vue Router support.

Features

Vue 3 support with Composition API
Vue Router integration for page views
Session replay and Web Vitals
Vue-specific error handler integration

Setup

Install

npm install vident-browser

src/main.ts

import { createApp } from 'vue';
import { createVidentBrowser } from 'vident-browser';
import App from './App.vue';
import router from './router';

createVidentBrowser({
  apiKey: import.meta.env.VITE_VIDENT_API_KEY,
});

const app = createApp(App);
app.use(router);
app.mount('#app');

Route tracking (Vue Router)

import { watch } from 'vue';
import { useRoute } from 'vue-router';
import { trackPageView } from 'vident-browser';

// In your App.vue setup
const route = useRoute();

watch(() => route.path, (path) => {
  trackPageView({ path });
});

Other Frameworks

Add Vident to React

Add Vident to Next.js

Add Vident to Angular

Add Vident to SvelteKit

Start catching errors in minutes

Create your free account and add Vident to your app. Two lines of code, no credit card.

Get started free