Vue.js Tracking.js

Question

I'm trying to make use of the tracking.js library in my vueJS application.

I've installed the package like so.

npm install --save tracking 

I'm then defining the library in my main.js file

import tracking from 'tracking'
Object.defineProperty(Vue.prototype, '$tracking', { value: tracking });

Then in my component i'm trying to use the library like so

mounted() {
  var tracker = new this.$tracking.ObjectTracker('webcam');
}

I feel I am calling the library wrong but the error message is

TypeError: this.$tracking.ObjectTracker is not a constructor

Answer 1

The problem is in the import statement, it seems that trackingjs does not support ES6 import. You have to have it in a sort of global scope

Object.defineProperty(Vue.prototype, '$tracking', { value: tracking });


new Vue({
  created: function() {
   var tracker = new this.$tracking.Tracker()
  console.log(tracker)
  }
})

Here JSFiddle example work as expected. Notice it's added only like a dependecy. i.e <script src="path/to/trackingjs">