如何在使用 Vue.js 的网站上安装 Matomo 跟踪代码？

如果您在网站中使用 Vue.js，则可以使用“vue-matomo” npm 包开始无缝跟踪 Matomo 中的数据。设置方法如下：

1.安装vue-matomo npm包。 npm install --save vue-matomo

2. 使用您的 Matomo 实例详细信息进行初始化VueMatomo（main.js下面的示例代码）。 Vue3 的示例代码：

代码语言：javascript复制

    import { createApp } from 'vue'
    import VueMatomo from 'vue-matomo'
    import App from './App.vue'

    createApp(App)
        .use(VueMatomo, {
            // Configure your matomo server and site by providing
            host: '{YOUR_MATOMO_INSTANCE_URL}',
            siteId: {YOUR_SITE_ID},
        })
        .mount('#app')


    window._paq.push(['trackPageView']); //To track pageview

Vue2 的示例代码：

代码语言：javascript复制

    import Vue from 'vue'
    import App from './App.vue'
    import VueMatomo from 'vue-matomo'

    Vue.use(VueMatomo, {
        host: '{YOUR_MATOMO_INSTANCE_URL}',
        siteId: {YOUR_SITE_ID}
    });

    new Vue({
      el: '#app',
      router,
      components: {App},
      template: ''
    })

    window._paq.push(['trackPageView']); //To track pageview

恭喜！您已通过“vue-matomo”npm 包成功安装了 Matomo Analytics 跟踪代码。要验证是否正在跟踪点击，请访问您的网站并检查此数据在您的 Matomo 实例中是否可见。

注意： * 如果您按照这些步骤操作，您现在可以通过 访问组件中的 Matomo window._paq.push。 * 如果您按照这些步骤操作，但没有数据进入 Matomo，您可以联系我们的支持团队寻求帮助，或尝试使用Matomo 标签管理器（对于单页应用程序请使用此链接）。

网站 npm app import 数据

0 人点赞