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

Comparing version 2.0.0-beta.3 to 2.0.0-beta.4

dist/index.d.ts

@@ -46,3 +46,4 @@ import type { GtmSupportOptions } from '@gtm-support/core';
 declare const _default: VueGtmPlugin;
-export { assertIsGtmId, DataLayerObject, GtmIdContainer, GtmQueryParams, GtmSupport, GtmSupportOptions, hasScript, loadScript, LoadScriptOptions, TrackEventOptions, } from '@gtm-support/core';
+export { assertIsGtmId, GtmSupport, hasScript, loadScript, } from '@gtm-support/core';
+export type { DataLayerObject, GtmIdContainer, GtmQueryParams, GtmSupportOptions, LoadScriptOptions, TrackEventOptions, } from '@gtm-support/core';
 export { GtmPlugin };
@@ -49,0 +50,0 @@ export default _default;

dist/index.js

@@ -1,140 +0,105 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useGtm = exports.GtmPlugin = exports.loadScript = exports.hasScript = exports.GtmSupport = exports.assertIsGtmId = exports.createGtm = void 0;
-const core_1 = require("@gtm-support/core");
-Object.defineProperty(exports, "GtmPlugin", { enumerable: true, get: function () { return core_1.GtmSupport; } });
-const vue_1 = require("vue");
+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;
-/**
- * Installation procedure.
- *
- * @param app The Vue app instance.
- * @param options Configuration options.
- */
-function install(app, options = { id: '' }) {
-    // Apply default configuration
-    options = { trackOnNextTick: false, ...options };
-    // Add to vue prototype and also from globals
-    gtmPlugin = new core_1.GtmSupport(options);
-    app.config.globalProperties.$gtm = gtmPlugin;
-    // Check if plugin is running in a real browser or e.g. in SSG mode
-    if (gtmPlugin.isInBrowserContext()) {
-        // Handle vue-router if defined
-        if (options.vueRouter) {
-            initVueRouterGuard(app, options.vueRouter, options.ignoredViews, options.trackOnNextTick, options.vueRouterAdditionalEventData);
-        }
-        // Load GTM script when enabled
-        if (gtmPlugin.options.enabled && gtmPlugin.options.loadScript) {
-            if (Array.isArray(options.id)) {
-                options.id.forEach((id) => {
-                    if (typeof id === 'string') {
-                        (0, core_1.loadScript)(id, options);
-                    }
-                    else {
-                        const newConf = {
-                            ...options,
-                        };
-                        if (id.queryParams != null) {
-                            newConf.queryParams = {
-                                ...newConf.queryParams,
-                                ...id.queryParams,
-                            };
-                        }
-                        (0, core_1.loadScript)(id.id, newConf);
-                    }
-                });
+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
+              };
             }
-            else {
-                (0, core_1.loadScript)(options.id, options);
-            }
-        }
+            loadScript(id.id, newConf);
+          }
+        });
+      } else {
+        loadScript(options.id, options);
+      }
     }
-    app.provide('gtm', options);
+  }
+  app.provide("gtm", options);
 }
-/**
- * Initialize the router guard.
- *
- * @param app The Vue app instance.
- * @param vueRouter The Vue router instance to attach the guard.
- * @param ignoredViews An array of route name that will be ignored.
- * @param trackOnNextTick Whether or not to call `trackView` in `Vue.nextTick`.
- * @param deriveAdditionalEventData Callback to derive additional event data.
- */
 function initVueRouterGuard(app, vueRouter, ignoredViews = [], trackOnNextTick, deriveAdditionalEventData = () => ({})) {
-    // eslint-disable-next-line jsdoc/require-jsdoc
-    function isNavigationFailure(failure, navigationFailureType) {
-        if (!(failure instanceof Error)) {
-            return false;
-        }
-        return !!(failure.type & navigationFailureType);
+  function isNavigationFailure(failure, navigationFailureType) {
+    if (!(failure instanceof Error)) {
+      return false;
     }
-    vueRouter.afterEach(async (to, from, failure) => {
-        var _a, _b, _c, _d;
-        // Ignore some routes
-        if (typeof to.name !== 'string' ||
-            (Array.isArray(ignoredViews) && ignoredViews.includes(to.name)) ||
-            (typeof ignoredViews === 'function' && ignoredViews(to, from))) {
-            return;
-        }
-        // Dispatch vue event using meta gtm value if defined otherwise fallback to route name
-        const name = to.meta && typeof to.meta.gtm === 'string' && !!to.meta.gtm
-            ? to.meta.gtm
-            : to.name;
-        if (isNavigationFailure(failure, 4 /* NAVIGATION_ABORTED */)) {
-            if (gtmPlugin === null || gtmPlugin === void 0 ? void 0 : gtmPlugin.debugEnabled()) {
-                console.log(`[VueGtm]: '${name}' not tracked due to navigation aborted`);
-            }
-        }
-        else if (isNavigationFailure(failure, 8 /* NAVIGATION_CANCELLED */)) {
-            if (gtmPlugin === null || gtmPlugin === void 0 ? void 0 : gtmPlugin.debugEnabled()) {
-                console.log(`[VueGtm]: '${name}' not tracked due to navigation cancelled`);
-            }
-        }
-        const additionalEventData = {
-            ...(await deriveAdditionalEventData(to, from)),
-            ...(_a = to.meta) === null || _a === void 0 ? void 0 : _a.gtmAdditionalEventData,
-        };
-        const baseUrl = (_d = (_c = (_b = vueRouter.options) === null || _b === void 0 ? void 0 : _b.history) === null || _c === void 0 ? void 0 : _c.base) !== null && _d !== void 0 ? _d : '';
-        let fullUrl = baseUrl;
-        if (!fullUrl.endsWith('/')) {
-            fullUrl += '/';
-        }
-        fullUrl += to.fullPath.startsWith('/')
-            ? to.fullPath.substring(1)
-            : to.fullPath;
-        if (trackOnNextTick) {
-            void (0, vue_1.nextTick)(() => {
-                gtmPlugin === null || gtmPlugin === void 0 ? void 0 : gtmPlugin.trackView(name, fullUrl, additionalEventData);
-            });
-        }
-        else {
-            gtmPlugin === null || gtmPlugin === void 0 ? void 0 : gtmPlugin.trackView(name, fullUrl, additionalEventData);
-        }
-    });
+    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);
+    }
+  });
 }
-/**
- * Create the Vue GTM instance.
- *
- * @param options Options.
- * @returns The Vue GTM plugin instance.
- */
 function createGtm(options) {
-    return { install: (app) => install(app, options) };
+  return { install: (app) => install(app, options) };
 }
-exports.createGtm = createGtm;
 const _default = { install };
-var core_2 = require("@gtm-support/core");
-Object.defineProperty(exports, "assertIsGtmId", { enumerable: true, get: function () { return core_2.assertIsGtmId; } });
-Object.defineProperty(exports, "GtmSupport", { enumerable: true, get: function () { return core_2.GtmSupport; } });
-Object.defineProperty(exports, "hasScript", { enumerable: true, get: function () { return core_2.hasScript; } });
-Object.defineProperty(exports, "loadScript", { enumerable: true, get: function () { return core_2.loadScript; } });
-exports.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`.
- */
 function useGtm() {
-    return gtmPlugin;
+  return gtmPlugin;
 }
-exports.useGtm = useGtm;
+export {
+  GtmSupport2 as GtmPlugin,
+  GtmSupport3 as GtmSupport,
+  assertIsGtmId,
+  createGtm,
+  _default as default,
+  hasScript,
+  loadScript2 as loadScript,
+  useGtm
+};

package.json

 {
   "name": "@gtm-support/vue-gtm",
-  "version": "2.0.0-beta.3",
+  "version": "2.0.0-beta.4",
   "description": "Simple implementation of Google Tag Manager for Vue",
-  "main": "dist/index.js",
+  "scripts": {
+    "clean": "rimraf coverage dist pnpm-lock.yaml node_modules",
+    "build": "tsc --noEmit && vite build",
+    "format": "prettier --write .",
+    "lint": "eslint .",
+    "test": "vitest",
+    "prepublishOnly": "pnpm run clean && pnpm install && pnpm run build"
+  },
+  "type": "module",
+  "files": [
+    "dist"
+  ],
+  "main": "dist/index.cjs",
+  "module": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "exports": {
+    ".": {
+      "import": "./dist/index.js",
+      "require": "./dist/index.cjs"
+    }
+  },
   "author": {
@@ -19,10 +39,2 @@ "name": "Christopher Quadflieg",
   "homepage": "https://github.com/gtm-support/vue-gtm",
-  "scripts": {
-    "clean": "rm -Rf dist pnpm-lock.yaml node_modules",
-    "build": "tsc",
-    "format": "prettier --write .",
-    "lint": "eslint .",
-    "test": "vitest",
-    "prepublishOnly": "pnpm run clean && pnpm install && pnpm run build"
-  },
   "repository": {
@@ -54,13 +66,8 @@ "type": "git",
   ],
-  "files": [
-    "dist",
-    "src",
-    "tsconfig.json"
-  ],
   "dependencies": {
-    "@gtm-support/core": "^1.4.1"
+    "@gtm-support/core": "^2.0.0-beta.1"
   },
   "devDependencies": {
-    "@typescript-eslint/eslint-plugin": "~5.38.0",
-    "@typescript-eslint/parser": "~5.38.0",
+    "@typescript-eslint/eslint-plugin": "~5.39.0",
+    "@typescript-eslint/parser": "~5.39.0",
     "eslint": "~8.24.0",
@@ -73,8 +80,11 @@ "eslint-config-prettier": "~8.5.0",
     "eslint-plugin-spellcheck": "~0.0.19",
-    "jsdom": "~20.0.0",
+    "jsdom": "~20.0.1",
     "prettier": "2.7.1",
     "prettier-plugin-organize-imports": "~3.1.1",
-    "typescript": "~4.8.3",
+    "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.39",
+    "vue": "^3.2.40",
     "vue-router": "^4.1.5"
@@ -93,3 +103,3 @@ },
   },
-  "packageManager": "pnpm@7.12.2"
+  "packageManager": "pnpm@7.13.2"
 }

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

Improved metrics

Is type module

Yes

Worsened metrics

Total package byte prevSize

22268

decreased by-19.27%

Dev dependency count

19

increased by18.75%

Number of package files

6

decreased by-14.29%

Lines of code

279

decreased by-34.51%

Number of medium supply chain risk alerts

1

increased byInfinity%

Dependency changes

• + Added@gtm-support/core@2.3.1(transitive)

• - Removed@gtm-support/core@1.4.2(transitive)

• Updated@gtm-support/core@^2.0.0-beta.1