Nuclear Powered Marshmallows

    gtm-vue
    TypeScript icon, indicating that this package has built-in type declarations

    0.2.0 • Public • Published

    gtm-vue

    (Currently in Beta until testing is added. Use with care.)

    An easy way of using Google Tag Manager with Vue.

    Heavily inspired by the package vue-gtm by mib200. This package merely adds some extra things like a useful tracking directive (v-track), and types. It will also feature testing soon.

    Installation

    yarn add gtm-vue
    import GTMVue from 'gtm-vue';
     
    // Passing in your instance of vue-router here will setup automatic view tracking
    Vue.use(GTMVue, {...GTMVueOptions})

    Possible options are defined by the GTMVueOptions interface

    interface GTMVueOptions {
      id: string;
      enabled?: boolean;
      debug?: boolean;
      router?: VueRouter;
      ignoredViews?: string[];
      trackOnNextTick?: boolean;
      disableDirective?: boolean;
      directiveName?: string;
    }

    The v-track directive

    <template>
      <a v-track="{category: 'internal-link', label: 'my-url', value: 100}" href="/my-url/">
        Click me!
      </a>
    </template>

    Options are

    interface TrackEventOptions {
      event?: string;
      category: string;
      action: string;
      label: string;
      value: string | number;
      noninteraction?: boolean;
      [key: string]: any;
    }

    Install

    npm i gtm-vue

    DownloadsWeekly Downloads

    117

    Version

    0.2.0

    License

    MIT

    Unpacked Size

    14 kB

    Total Files

    21

    Last publish

    Collaborators

    • deanp