analytics icon indicating copy to clipboard operation
analytics copied to clipboard

Vue plugin

Open JuroOravec opened this issue 5 years ago • 3 comments

Hi,

I've made a Vue plugin for the analytics package.

  • Plugin registration and the instance inheritance within Vue components is based on how Vuetify does it.
    • This means all components inherit the same instance, but any component can have its instances overriden, and in that case all children will use the new instance instead.
    • It also means that the plugin remembers if it was already installed for a particular Vue constructor.
  • Plugin adds $analytics to Vue instance
  • Additions to Vue instance are covered by TypeScript
  • Integrated with vue-router
    • The plugin auto-tracks route changes if router is passed as an option to Vue.use()
The usage is like so
import Vue from 'vue';
import VueAnalytics from './analytics-vue-plugin';

import router from './router';

// Install plugin
Vue.use(VueAnalytics, {
  // Pass router to track route changes
  router,
});

// Configure analytics
const analytics = new VueAnalytics({
  mixpanelToken,
});

new Vue({
  // Pass to Vue instance
  analytics,
  router,
  vuetify,
  render: (h: CreateElement): VNode => h(App),
}).$mount('#root');

I would like to contribute it to the project.

Does that fall within the scope of the project?

What would be the best course of action? Would it be fine to make a branch with it as suggested here https://github.com/DavidWells/analytics/blob/master/CONTRIBUTING.md?

JuroOravec avatar Nov 10 '20 21:11 JuroOravec

Hey @JuroOravec sounds great!

Does that fall within the scope of the project?

Yeah. Happy to see more framework helpers.

What would be the best course of action?

A good setup for this might be to just copy/paste the https://github.com/DavidWells/analytics/tree/master/packages/use-analytics package setup and build the vue lib from this.

This way the build / watch scripts are the same/similar https://github.com/DavidWells/analytics/blob/master/packages/use-analytics/package.json#L19-L20

There is also a vue demo that might be nice to update with your plugin

DavidWells avatar Nov 11 '20 00:11 DavidWells

Hey @DavidWells thanks for pointers, sounds good! I'll get to it in the next few days.

JuroOravec avatar Nov 11 '20 23:11 JuroOravec

@JuroOravec any progress on this? I wouldn't mind taking a look

adamdehaven avatar Jan 19 '21 21:01 adamdehaven