Aller au contenu
Toutes les pages de la documentation

Guides d’installation

Installer sur Vue

Ajoutez la balise dans index.html ou démarrez le traceur dans main.ts. Les navigations de Vue Router sont comptées automatiquement.

Ajoutez le script dans index.html

Ajoutez la balise dans le <head> d’index.html, qui sert toutes les routes de votre application.

index.htmlHTML
<script defer
  src="https://cdn-stg.webmetric.io/v1/b.js"
  data-key="wm_w_your_write_key"
  data-host="https://in-stg.webmetric.io"></script>

Ou démarrez-le dans main.ts

src/main.tsTypeScript
import { init } from "@webmetric/sdk";
import { createApp } from "vue";

import App from "./App.vue";

init({
  key: "wm_w_your_write_key",
  host: "https://in-stg.webmetric.io",
  assetOrigin: "https://cdn-stg.webmetric.io/v1",
});

createApp(App).mount("#app");

Nuxt

Avec Nuxt, ajoutez le script dans le head de chaque page depuis votre configuration :

nuxt.config.tsTypeScript
export default defineNuxtConfig({
  app: {
    head: {
      script: [
        {
          src: "https://cdn-stg.webmetric.io/v1/b.js",
          defer: true,
          "data-key": "wm_w_your_write_key",
          "data-host": "https://in-stg.webmetric.io",
        },
      ],
    },
  },
});

Routage

Vue Router en mode historique est suivi automatiquement. Avec createWebHashHistory, ajoutez data-hash="true" pour que chaque changement de fragment compte comme une page vue.

Vérification

Ouvrez votre application, passez par quelques routes, puis ouvrez la vue d’ensemble. Si rien n’arrive, consultez le dépannage.