Updated 20 October 2026

Nuxt analytics

Privacy-first, cookieless analytics for Nuxt: one entry in nuxt.config, in the server-rendered HTML, with every route change counted.

In short

  • One entry in app.head.script of nuxt.config.ts. The tag is in the server-rendered HTML of every page.
  • Navigation between pages is counted by itself, once each.
  • No cookie banner needed in cookieless mode, no IP address stored, and nothing loaded from another company.

Install on Nuxt#

Use your own site id and server address in the code below. On trckable Cloud the address is https://cloud.trckable.com.

Add the script to the head of every page in nuxt.config.ts:

export default defineNuxtConfig({
  app: {
    head: {
      script: [
        {
          src: 'https://stats.example.com/js/tkb_a1b2c3d4.js',
          defer: true,
          'data-site': 'tkb_a1b2c3d4',
          'data-domain': 'example.com',
        },
      ],
    },
  },
})

Or let the CLI do it: npx trckable init looks at the project, recognises Nuxt, prints exactly what it would change and writes only with --yes.

Open your site once, then run npx trckable doctor --host https://stats.example.com --site tkb_a1b2c3d4 --url https://example.com. It only reads, and tells you whether the tag is on the page and the server answers.

What to know about Nuxt#

  • Server rendering is fine. The tag is part of the HTML Nuxt sends, and defer keeps it from delaying the page.
  • Route changes are counted by trckable. It listens for the history API that Nuxt's router uses, and counts the route change. The same URL pushed twice is one page view.
  • Hash mode needs a switch. If you set hashMode: true in the router options, add data-hash to the tag and turn on Settings → General → Reports → Pages after the #.
  • Local development is ignored unless the tag has data-dev, so nuxt dev does not fill your numbers.

Goals and revenue#

A goal needs no code: put an attribute on the element and each click is counted.

<button data-trckable-goal="signup" data-trckable-goal-plan="pro">Start trial</button>

Connect Stripe, Paddle, Lemon Squeezy, Polar or Dodo Payments with one key, and each payment is credited to the visit that earned it, so revenue shows next to traffic. See revenue attribution.

Questions#

Do I need a Nuxt module?
No. The script tag is the documented install and app.head.script is the framework's own way of adding it. The trckable npm package also works: call init once in a client-only plugin.
Do I need a cookie banner on my Nuxt site?
Not for the counting itself. In cookieless mode (add data-cookieless to the tag) nothing is stored on the visitor's device and no IP address is kept. Whether your site needs a banner for other reasons is a question for your own situation; the cookie banner guide explains the rules in plain words.
Can ad blockers stop it?
A blocker can block any script, and trckable does not claim otherwise. Sending events through your own domain removes the separate analytics file a blocklist would match by name, which is the accurate setup. The same-origin proxy guide shows how.
Is it free for a Nuxt site?
The server is open source and free to self-host, and the tracker is MIT licensed. If you would rather not run a server, trckable Cloud runs it for you; the plans are on the pricing page.

Keep reading#

Other stacks#

Start free