# Add Privatus Analytics to a Vue app

> Add privacy-friendly analytics to a Vue 3 app with a snippet in index.html, track Vue Router history or hash navigation and send custom events from components.

Add the snippet to `index.html`:

```html
<script defer src="https://privatusanalytics.com/js/pa.js" data-site="pa_YOURSITEID"></script>
```

Vue Router's `createWebHistory()` uses `history.pushState`, which the
tracker follows automatically. With `createWebHashHistory()`, add
`data-spa="hash"` so hash changes count as pageviews.

## Events

```vue
<script setup>
function download() {
  window.privatus?.track('Download', { file: 'price-list.pdf' })
}
</script>
```

Or use the typed client from `@privatus/tracker` (`init()` and
`getClient()`), as shown in the [React guide](/docs/install/react). For
Nuxt, see the [Nuxt guide](/docs/install/nuxt).

> **Warning:** `@privatus/tracker` is not published on npm yet. Until it is,
> don't install a package with this name from the public registry,
> because anyone could have published it. Use the snippet above
> instead.