track better with vue-matomo

package-lock.json

@@ -14256,6 +14256,11 @@
         "vue-style-loader": "^4.1.0"
       }
     },
+    "vue-matomo": {
+      "version": "3.13.0-4",
+      "resolved": "https://registry.npmjs.org/vue-matomo/-/vue-matomo-3.13.0-4.tgz",
+      "integrity": "sha512-RInrx3Slyy7/5PbMVMVZGFIzVE99f7tYJG+jEbVtw7XJLmi5Aj4rFVVPUWgYL/fBrPxqLDlhV7O4S4+2NGNnPg=="
+    },
     "vue-nprogress": {
       "version": "0.1.5",
       "resolved": "https://registry.npmjs.org/vue-nprogress/-/vue-nprogress-0.1.5.tgz",

package.json

@@ -24,6 +24,7 @@
     "vue-clipboard2": "^0.3.1",
     "vue-cookie-accept-decline": "^5.3.1",
     "vue-i18n": "^8.15.3",
+    "vue-matomo": "^3.13.0-4",
     "vue-nprogress": "^0.1.5",
     "vue-router": "^3.1.5",
     "vuex": "^3.1.2",

public/index.html

@@ -13,23 +13,5 @@
       <strong>We're sorry but app doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
     </noscript>
     <div id="app"></div>
-    <!-- built files will be auto injected -->
-    <!-- Matomo -->
-    <script type="text/javascript">
-      var _paq = _paq || [];
-      /* tracker methods like "setCustomDimension" should be called before "trackPageView" */
-      _paq.push(["setCookieDomain", "*.solidbase.info"]);
-      _paq.push(['requireConsent']);
-      _paq.push(['trackPageView']);
-      _paq.push(['enableLinkTracking']);
-      (function() {
-        var u="//piwik.allmende.io/";
-        _paq.push(['setTrackerUrl', u+'piwik.php']);
-        _paq.push(['setSiteId', '18']);
-        var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
-        g.type='text/javascript'; g.async=true; g.defer=true; g.src=u+'piwik.js'; s.parentNode.insertBefore(g,s);
-      })();
-    </script>
-    <!-- End Matomo Code -->
   </body>
 </html>

src/main.js

@@ -10,6 +10,81 @@ import './registerServiceWorker'
 import './plugins/axios'
 import './assets/scss/app.scss'
 
+import VueMatomo from 'vue-matomo'
+
+Vue.use(VueMatomo, {
+  // Configure your matomo server and site by providing
+  host: 'https://piwik.allmende.io',
+  siteId: 18,
+
+  // Changes the default .js and .php endpoint's filename
+  // Default: 'matomo'
+  trackerFileName: 'matomo',
+
+  // Overrides the autogenerated tracker endpoint entirely
+  // Default: undefined
+  // trackerUrl: 'https://example.com/whatever/endpoint/you/have',
+
+  // Overrides the autogenerated tracker script path entirely
+  // Default: undefined
+  // trackerScriptUrl: 'https://example.com/whatever/script/path/you/have',
+
+  // Enables automatically registering pageviews on the router
+  router: router,
+
+  // Enables link tracking on regular links. Note that this won't
+  // work for routing links (ie. internal Vue router links)
+  // Default: true
+  enableLinkTracking: true,
+
+  // Require consent before sending tracking information to matomo
+  // Default: false
+  requireConsent: true,
+
+  // Whether to track the initial page view
+  // Default: true
+  trackInitialView: true,
+
+  // Run Matomo without cookies
+  // Default: false
+  disableCookies: false,
+
+  // Enable the heartbeat timer (https://developer.matomo.org/guides/tracking-javascript-guide#accurately-measure-the-time-spent-on-each-page)
+  // Default: false
+  enableHeartBeatTimer: false,
+
+  // Set the heartbeat timer interval
+  // Default: 15
+  heartBeatTimerInterval: 15,
+
+  // Whether or not to log debug information
+  // Default: false
+  debug: false,
+
+  // UserID passed to Matomo (see https://developer.matomo.org/guides/tracking-javascript-guide#user-id)
+  // Default: undefined
+  userId: undefined,
+
+  // Share the tracking cookie across subdomains (see https://developer.matomo.org/guides/tracking-javascript-guide#measuring-domains-andor-sub-domains)
+  // Default: undefined, example '*.example.com'
+  cookieDomain: '*.solidbase.info',
+
+  // Tell Matomo the website domain so that clicks on these domains are not tracked as 'Outlinks'
+  // Default: undefined, example: '*.example.com'
+  domains: '*.solidbase.info',
+
+  // A list of pre-initialization actions that run before matomo is loaded
+  // Default: []
+  // Example: [
+  //   ['API_method_name', parameter_list],
+  //   ['setCustomVariable','1','VisitorType','Member'],
+  //   ['appendToTrackingUrl', 'new_visit=1'],
+  //   etc.
+  // ]
+  preInitActions: []
+});
+
+
 Vue.use(Buefy, {
   defaultIconPack: 'fas'
 })

src/views/About.vue

@@ -149,7 +149,7 @@ export default {
         _paq.push(['forgetConsentGiven']);
         this.$refs.mtmcnsnt.$refs.cnsntbnnr.removeCookie()
         this.$refs.mtmcnsnt.$refs.cnsntbnnr.init()
-    },
+    }
   }
 }
 </script>