Skip to main content
To add tinyanalytics to a Nuxt app, declare the tracking script in nuxt.config so Nuxt injects it into the <head> of every page. Route changes are tracked automatically, so you don’t need to touch the router.

Before you start

  • A tinyanalytics site. If you don’t have one yet, follow the Quickstart.
  • Your site’s numeric site ID, from Settings → Tracking in your dashboard.

Add the script in nuxt.config

Add the script to the app.head.script array in nuxt.config.ts:
nuxt.config.ts
Replace YOUR_SITE_ID with your real site ID. If you’ve toggled options in Settings → Tracking, add each one as another "data-..." key in the same object.

Client-side navigation is tracked automatically

Nuxt renders route changes on the client, and tinyanalytics records each one as a new pageview by default (data-track-spa). Moving between pages is captured for you. See Track single-page apps to change this.

Verify

Run or deploy your app, open it in a browser, then check Realtime in your dashboard for your visit. See Verify your setup for the full check.
Your install is working when your own visit appears in Realtime in your dashboard.

Install on Vue

A plain Vue (Vite) app instead.

Configure the tracking script

Every data-* option you can set.

Track custom events

Send events from your components.

Verify your setup

Confirm tracking works.