Vue.js
Add Reignat analytics to your Vue 3 or Nuxt app.
Via index.html
The quickest way: add the script to your index.html before </body>:
<body> <div id="app"></div> <script src="https://www.reignat.com/tracker.js" data-site="your-project-id" defer ></script></body><body> <div id="app"></div> <script src="https://www.reignat.com/tracker.js" data-site="your-project-id" defer ></script></body>Via Vue plugin
For Vue Router apps, register a simple plugin in main.ts so pageviews are tracked on every route change:
main.ts
import { createApp } from "vue"import { createRouter } from "vue-router"import App from "./App.vue" const router = createRouter({ /* your routes */ }) const app = createApp(App)app.use(router) // Load tracker onceconst script = document.createElement("script")script.src = "https://www.reignat.com/tracker.js"script.dataset.site = "your-project-id"script.defer = truedocument.head.appendChild(script) app.mount("#app")import { createApp } from "vue"import { createRouter } from "vue-router"import App from "./App.vue" const router = createRouter({ /* your routes */ }) const app = createApp(App)app.use(router) // Load tracker onceconst script = document.createElement("script")script.src = "https://www.reignat.com/tracker.js"script.dataset.site = "your-project-id"script.defer = truedocument.head.appendChild(script) app.mount("#app")ℹ
Reignat's tracker automatically listens to
history.pushState and popstate so route changes in Vue Router are tracked without any extra config.Verify
Deploy your app and visit it in a browser. A pageview should appear in your Reignat dashboard within seconds.
ℹ
Reignat ignores
localhost automatically. Always test on your deployed URL.