- 
@entrolytics/vue-sdk is the official Vue SDK for Entrolytics - first-party growth analytics for the edge. Add powerful analytics to your Vue 3 applications with zero configuration.
Why use this SDK?
- Zero-config setup with automatic environment detection
- Full Vue 3 Composition API support with composables
- TypeScript-first with complete type definitions
- Edge-optimized with sub-50ms response times globally
|
|
 1. Install npm i @entrolytics/vue-sdk
|
 2. Add Plugin app.use(createEntrolytics())
|
 3. Configure Set Website ID in .env
|
 4. Track View analytics in dashboard |
npm install @entrolytics/vue-sdk
# or
pnpm add @entrolytics/vue-sdk// main.ts
import { createApp } from 'vue';
import { createEntrolytics } from '@entrolytics/vue';
import App from './App.vue';
const app = createApp(App);
// Zero-config: automatically reads from .env
app.use(createEntrolytics());
app.mount('#app');Add to your .env file:
VITE_ENTROLYTICS_WEBSITE_ID=your-website-id
VITE_ENTROLYTICS_HOST=https://entrolytics.click// Reads from VITE_ENTROLYTICS_WEBSITE_ID and VITE_ENTROLYTICS_HOST
app.use(createEntrolytics());createEntrolytics({
// Required: Your Entrolytics website ID
websiteId: 'your-website-id',
// Optional: Custom host (for self-hosted)
host: 'https://entrolytics.click',
// Optional: Auto-track page views (default: true)
autoTrack: true,
// Optional: Respect Do Not Track (default: false)
respectDnt: false,
// Optional: Cross-domain tracking
domains: ['example.com', 'blog.example.com'],
});The plugin loads the canonical /script.js tracker from the configured host.
Main composable for accessing all functionality.
<script setup>
import { useEntrolytics } from '@entrolytics/vue';
const { track, identify, isLoaded, config } = useEntrolytics();
function handleClick() {
track('button_click', { variant: 'primary' });
}
</script>
<template>
<button @click="handleClick">Click me</button>
</template>Track custom events.
<script setup>
import { useTrackEvent } from '@entrolytics/vue';
const { track } = useTrackEvent();
function handlePurchase() {
track('purchase', {
revenue: 99.99,
currency: 'USD',
product_id: 'pro-plan',
});
}
</script>Track page views with vue-router.
<script setup>
import { useRoute } from 'vue-router';
import { useTrackPageView } from '@entrolytics/vue';
const route = useRoute();
useTrackPageView(() => route.path);
</script>Identify users for logged-in tracking.
<script setup>
import { watch } from 'vue';
import { useIdentify } from '@entrolytics/vue';
const { identify } = useIdentify();
// When user logs in
watch(user, newUser => {
if (newUser) {
identify(newUser.id, {
email: newUser.email,
plan: newUser.subscription,
});
}
});
</script>The plugin also adds a global property accessible in templates and options API:
<script>
export default {
methods: {
trackClick() {
this.$entrolytics.track('button_click');
},
},
};
</script>Full TypeScript support with exported types:
import type { EntrolyticsOptions, EntrolyticsInstance } from '@entrolytics/vue';MIT License - see LICENSE file for details.
