@gtm-support/vue-gtm - npm Package Compare versions

Comparing version 2.0.0 to 2.1.0

dist/index.d.ts

@@ -1,55 +0,24 @@
-import type { GtmSupportOptions } from '@gtm-support/core';
-import { GtmSupport as GtmPlugin } from '@gtm-support/core';
-import type { Plugin } from 'vue';
-import type { RouteLocationNormalized, Router } from 'vue-router';
-/**
- * Options passed to the plugin.
- */
-export interface VueGtmUseOptions extends GtmSupportOptions {
-    /**
-     * Pass the router instance to automatically sync with router.
-     */
+import { GtmSupport, GtmSupportOptions } from '@gtm-support/core';
+export { DataLayerObject, GtmIdContainer, GtmSupport as GtmPlugin, GtmQueryParams, GtmSupport, GtmSupportOptions, LoadScriptOptions, TrackEventOptions, assertIsGtmId, hasScript, loadScript } from '@gtm-support/core';
+import { Plugin } from 'vue';
+import { Router, RouteLocationNormalized } from 'vue-router';
+
+type IgnoredViews = string[] | ((to: RouteLocationNormalized, from: RouteLocationNormalized) => boolean);
+interface VueGtmUseOptions extends GtmSupportOptions {
     vueRouter?: Router;
-    /**
-     * Derive additional event data after navigation.
-     */
     vueRouterAdditionalEventData?: (to: RouteLocationNormalized, from: RouteLocationNormalized) => Record<string, any> | Promise<Record<string, any>>;
-    /**
-     * Don't trigger events for specified router names.
-     */
-    ignoredViews?: string[] | ((to: RouteLocationNormalized, from: RouteLocationNormalized) => boolean);
-    /**
-     * Whether or not call `trackView` in `Vue.nextTick`.
-     */
+    ignoredViews?: IgnoredViews;
     trackOnNextTick?: boolean;
 }
-/**
- * Create the Vue GTM instance.
- *
- * @param options Options.
- * @returns The Vue GTM plugin instance.
- */
-export declare function createGtm(options: VueGtmUseOptions): VueGtmPlugin;
+declare function createGtm(options: VueGtmUseOptions): VueGtmPlugin;
 declare module '@vue/runtime-core' {
     interface ComponentCustomProperties {
-        /**
-         * The Vue GTM Plugin instance.
-         */
-        $gtm: GtmPlugin;
+        $gtm: GtmSupport;
     }
 }
-/**
- * Vue GTM Plugin.
- */
-export declare type VueGtmPlugin = Plugin;
+type VueGtmPlugin = Plugin;
 declare const _default: VueGtmPlugin;
-export { assertIsGtmId, GtmSupport, hasScript, loadScript, } from '@gtm-support/core';
-export type { DataLayerObject, GtmIdContainer, GtmQueryParams, GtmSupportOptions, LoadScriptOptions, TrackEventOptions, } from '@gtm-support/core';
-export { GtmPlugin };
-export default _default;
-/**
- * Returns GTM plugin instance to be used via Composition API inside setup method.
- *
- * @returns The Vue GTM instance if the it was installed, otherwise `undefined`.
- */
-export declare function useGtm(): GtmPlugin | undefined;
+
+declare function useGtm(): GtmSupport | undefined;
+
+export { VueGtmPlugin, VueGtmUseOptions, createGtm, _default as default, useGtm };

dist/index.js

@@ -1,105 +0,2 @@
-import { GtmSupport, loadScript } from "@gtm-support/core";
-import { GtmSupport as GtmSupport2, GtmSupport as GtmSupport3, assertIsGtmId, hasScript, loadScript as loadScript2 } from "@gtm-support/core";
-import { nextTick } from "vue";
-let gtmPlugin;
-function install(app, options = { id: "" }) {
-  options = { trackOnNextTick: false, ...options };
-  gtmPlugin = new GtmSupport(options);
-  app.config.globalProperties.$gtm = gtmPlugin;
-  if (gtmPlugin.isInBrowserContext()) {
-    if (options.vueRouter) {
-      initVueRouterGuard(
-        app,
-        options.vueRouter,
-        options.ignoredViews,
-        options.trackOnNextTick,
-        options.vueRouterAdditionalEventData
-      );
-    }
-    if (gtmPlugin.options.enabled && gtmPlugin.options.loadScript) {
-      if (Array.isArray(options.id)) {
-        options.id.forEach((id) => {
-          if (typeof id === "string") {
-            loadScript(id, options);
-          } else {
-            const newConf = {
-              ...options
-            };
-            if (id.queryParams != null) {
-              newConf.queryParams = {
-                ...newConf.queryParams,
-                ...id.queryParams
-              };
-            }
-            loadScript(id.id, newConf);
-          }
-        });
-      } else {
-        loadScript(options.id, options);
-      }
-    }
-  }
-  app.provide("gtm", options);
-}
-function initVueRouterGuard(app, vueRouter, ignoredViews = [], trackOnNextTick, deriveAdditionalEventData = () => ({})) {
-  function isNavigationFailure(failure, navigationFailureType) {
-    if (!(failure instanceof Error)) {
-      return false;
-    }
-    return !!(failure.type & navigationFailureType);
-  }
-  vueRouter.afterEach(async (to, from, failure) => {
-    var _a, _b, _c;
-    if (typeof to.name !== "string" || Array.isArray(ignoredViews) && ignoredViews.includes(to.name) || typeof ignoredViews === "function" && ignoredViews(to, from)) {
-      return;
-    }
-    const name = to.meta && typeof to.meta.gtm === "string" && !!to.meta.gtm ? to.meta.gtm : to.name;
-    if (isNavigationFailure(failure, 4)) {
-      if (gtmPlugin == null ? void 0 : gtmPlugin.debugEnabled()) {
-        console.log(
-          `[VueGtm]: '${name}' not tracked due to navigation aborted`
-        );
-      }
-    } else if (isNavigationFailure(failure, 8)) {
-      if (gtmPlugin == null ? void 0 : gtmPlugin.debugEnabled()) {
-        console.log(
-          `[VueGtm]: '${name}' not tracked due to navigation cancelled`
-        );
-      }
-    }
-    const additionalEventData = {
-      ...await deriveAdditionalEventData(to, from),
-      ...(_a = to.meta) == null ? void 0 : _a.gtmAdditionalEventData
-    };
-    const baseUrl = ((_c = (_b = vueRouter.options) == null ? void 0 : _b.history) == null ? void 0 : _c.base) ?? "";
-    let fullUrl = baseUrl;
-    if (!fullUrl.endsWith("/")) {
-      fullUrl += "/";
-    }
-    fullUrl += to.fullPath.startsWith("/") ? to.fullPath.substring(1) : to.fullPath;
-    if (trackOnNextTick) {
-      void nextTick(() => {
-        gtmPlugin == null ? void 0 : gtmPlugin.trackView(name, fullUrl, additionalEventData);
-      });
-    } else {
-      gtmPlugin == null ? void 0 : gtmPlugin.trackView(name, fullUrl, additionalEventData);
-    }
-  });
-}
-function createGtm(options) {
-  return { install: (app) => install(app, options) };
-}
-const _default = { install };
-function useGtm() {
-  return gtmPlugin;
-}
-export {
-  GtmSupport2 as GtmPlugin,
-  GtmSupport3 as GtmSupport,
-  assertIsGtmId,
-  createGtm,
-  _default as default,
-  hasScript,
-  loadScript2 as loadScript,
-  useGtm
-};
+import{GtmSupport as v,loadScript as m}from"@gtm-support/core";import{nextTick as O}from"vue";import{GtmSupport as k,assertIsGtmId as L,hasScript as S,loadScript as U}from"@gtm-support/core";var t;function G(i,e={id:""}){e={trackOnNextTick:!1,...e},t=new v(e),i.config.globalProperties.$gtm=t,t.isInBrowserContext()&&(e.vueRouter&&A(i,e.vueRouter,e.ignoredViews,e.trackOnNextTick,e.vueRouterAdditionalEventData),t.options.enabled&&t.options.loadScript&&(Array.isArray(e.id)?e.id.forEach(a=>{if(typeof a=="string")m(a,e);else{let o={...e};a.queryParams!=null&&(o.queryParams={...o.queryParams,...a.queryParams}),m(a.id,o)}}):m(e.id,e))),i.provide("gtm",e)}function A(i,e,a=[],o,g=()=>({})){function p(r,u){return r instanceof Error?!!(r.type&u):!1}e.afterEach(async(r,u,d)=>{var c,f,y;if(typeof r.name!="string"||Array.isArray(a)&&a.includes(r.name)||typeof a=="function"&&a(r,u))return;let s=r.meta&&typeof r.meta.gtm=="string"&&r.meta.gtm?r.meta.gtm:r.name;p(d,4)?t!=null&&t.debugEnabled()&&console.log(`[VueGtm]: '${s}' not tracked due to navigation aborted`):p(d,8)&&t!=null&&t.debugEnabled()&&console.log(`[VueGtm]: '${s}' not tracked due to navigation cancelled`);let l={...await g(r,u),...(c=r.meta)==null?void 0:c.gtmAdditionalEventData},n=((y=(f=e.options)==null?void 0:f.history)==null?void 0:y.base)??"";n.endsWith("/")||(n+="/"),n+=r.fullPath.startsWith("/")?r.fullPath.substring(1):r.fullPath,o?O(()=>{t==null||t.trackView(s,n,l)}):t==null||t.trackView(s,n,l)})}function x(i){return{install:e=>G(e,i)}}var N={install:G};var T=N;function P(){return t}export{v as GtmPlugin,k as GtmSupport,L as assertIsGtmId,x as createGtm,T as default,S as hasScript,U as loadScript,P as useGtm};
+//# sourceMappingURL=index.js.map

package.json

 {
   "name": "@gtm-support/vue-gtm",
-  "version": "2.0.0",
+  "version": "2.1.0",
   "description": "Simple implementation of Google Tag Manager for Vue",
   "scripts": {
-    "clean": "rimraf coverage dist pnpm-lock.yaml node_modules",
-    "build": "tsc --noEmit && vite build",
-    "format": "prettier --write .",
-    "lint": "eslint .",
+    "clean": "rimraf coverage .eslintcache dist pnpm-lock.yaml node_modules",
+    "build:clean": "rimraf dist",
+    "build:code": "tsup-node",
+    "build": "run-s build:clean build:code",
+    "format": "prettier --cache --write .",
+    "lint": "eslint --cache --cache-strategy content --report-unused-disable-directives .",
+    "ts-check": "tsc",
     "test": "vitest",
-    "prepublishOnly": "pnpm run clean && pnpm install && pnpm run build"
+    "prepublishOnly": "pnpm run clean && pnpm install && pnpm run build",
+    "preflight": "pnpm install && run-s format lint build test ts-check"
   },
@@ -19,8 +23,8 @@ "type": "module",
   "module": "dist/index.js",
-  "types": "dist/index.d.ts",
   "exports": {
     ".": {
-      "import": "./dist/index.js",
-      "require": "./dist/index.cjs"
-    }
+      "require": "./dist/index.cjs",
+      "default": "./dist/index.js"
+    },
+    "./package.json": "./package.json"
   },
@@ -70,24 +74,24 @@ "author": {
   "devDependencies": {
-    "@typescript-eslint/eslint-plugin": "~5.39.0",
-    "@typescript-eslint/parser": "~5.39.0",
-    "eslint": "~8.24.0",
-    "eslint-config-prettier": "~8.5.0",
-    "eslint-define-config": "~1.7.0",
+    "@typescript-eslint/eslint-plugin": "~6.2.1",
+    "@typescript-eslint/parser": "~6.2.1",
+    "eslint": "~8.46.0",
+    "eslint-config-prettier": "~8.9.0",
+    "eslint-define-config": "~1.22.0",
     "eslint-gitignore": "~0.1.0",
-    "eslint-plugin-jsdoc": "~39.3.6",
-    "eslint-plugin-prettier": "~4.2.1",
-    "eslint-plugin-spellcheck": "~0.0.19",
-    "jsdom": "~20.0.1",
-    "prettier": "2.7.1",
-    "prettier-plugin-organize-imports": "~3.1.1",
-    "rimraf": "~3.0.2",
-    "typescript": "~4.8.4",
-    "vite": "~3.1.6",
-    "vite-plugin-dts": "~1.6.5",
-    "vitest": "~0.23.4",
-    "vue": "^3.2.40",
-    "vue-router": "^4.1.5"
+    "eslint-plugin-jsdoc": "~46.4.5",
+    "eslint-plugin-prettier": "~5.0.0",
+    "eslint-plugin-spellcheck": "~0.0.20",
+    "jsdom": "~22.1.0",
+    "npm-run-all": "~4.1.5",
+    "prettier": "3.0.0",
+    "prettier-plugin-organize-imports": "~3.2.3",
+    "rimraf": "~5.0.1",
+    "tsup": "~7.1.0",
+    "typescript": "~5.1.6",
+    "vitest": "~0.34.0",
+    "vue": "^3.3.4",
+    "vue-router": "^4.2.4"
   },
   "peerDependencies": {
-    "vue": "^3.2.0"
+    "vue": ">= 3.2.0 < 4.0.0"
   },
@@ -100,5 +104,5 @@ "peerDependenciesMeta": {
   "optionalDependencies": {
-    "vue-router": "^4.1.0"
+    "vue-router": ">= 4.1.0 < 5.0.0"
   },
-  "packageManager": "pnpm@7.13.2"
+  "packageManager": "pnpm@8.6.11"
 }

README.md

@@ -75,2 +75,3 @@ <h1 align="center">Vue Google Tag Manager</h1>
     },
+    source: 'https://customurl.com/gtm.js', // Add your own serverside GTM script
     defer: false, // Script can be set to `defer` to speed up page load at the cost of less accurate results (in case visitor leaves before script is loaded, which is unlikely but possible). Defaults to false, so the script is loaded `async` by default
@@ -77,0 +78,0 @@ compatibility: false, // Will add `async` and `defer` to the script tag to not block requests for old browsers that do not support `async`

New alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Minified code

Quality

This package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

38540

increased by73.18%

Number of package files

9

increased by50%

Number of lines in readme file

305

increased by0.33%

Worsened metrics

Lines of code

37

decreased by-86.74%

Number of low quality alerts

1

increased byInfinity%

Number of medium supply chain risk alerts

1

increased byInfinity%

No dependency changes