Vue 3 Support

.gitignore

@@ -21,5 +21,3 @@ node_modules/
 # dotenv environment variables file
 .env*
 
-# build output
-lib

lib/cjs/extend.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

lib/cjs/index.js

@@ -0,0 +1,13 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = exports.Vue3Plausible = exports.VuePlausible = void 0;
+require("./extend");
+var vue_plugin_1 = require("./vue-plugin");
+Object.defineProperty(exports, "VuePlausible", { enumerable: true, get: function () { return __importDefault(vue_plugin_1).default; } });
+var vue_3_plugin_1 = require("./vue-3-plugin");
+Object.defineProperty(exports, "Vue3Plausible", { enumerable: true, get: function () { return __importDefault(vue_3_plugin_1).default; } });
+var nuxt_module_1 = require("./nuxt-module");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(nuxt_module_1).default; } });

lib/cjs/module-options.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

lib/cjs/nuxt-module.js

@@ -0,0 +1,30 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.meta = void 0;
+const path_1 = __importDefault(require("path"));
+// default options, fallback to plausible-tracker defaults
+const defaultOptions = {
+    domain: undefined,
+    hashMode: undefined,
+    trackLocalhost: undefined,
+    apiHost: undefined,
+    enableAutoPageviews: true,
+    enableAutoOutboundTracking: false
+};
+const PlausibleModule = function (moduleOptions) {
+    if (!this)
+        return;
+    const options = Object.assign(Object.assign(Object.assign({}, defaultOptions), this.options.plausible), moduleOptions);
+    this.addPlugin({
+        src: path_1.default.resolve(__dirname, '../esm/nuxt-plugin.js'),
+        mode: 'client',
+        ssr: false,
+        fileName: 'vue-plausible.client.js',
+        options
+    });
+};
+exports.default = PlausibleModule;
+exports.meta = require('../../package.json');

lib/cjs/nuxt-plugin.js

@@ -0,0 +1,27 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const plausible_tracker_1 = __importDefault(require("plausible-tracker"));
+const PlausiblePlugin = (context, inject) => {
+    var _a;
+    const optionsDomain = '<%= options.domain %>';
+    const optionsHashMode = '<%= options.hashMode %>';
+    const optionsTrackLocalhost = '<%= options.trackLocalhost %>';
+    const optionsApiHost = '<%= options.apiHost %>';
+    const optionsEnableAutoPageviews = '<%= options.enableAutoPageviews %>';
+    const optionsEnableAutoOutboundTracking = '<%= options.enableAutoOutboundTracking %>';
+    const options = Object.assign({ domain: optionsDomain.length ? optionsDomain : null, hashMode: optionsHashMode === 'true', trackLocalhost: optionsTrackLocalhost === 'true', apiHost: optionsApiHost.length ? optionsApiHost : 'https://plausible.io', enableAutoPageviews: optionsEnableAutoPageviews === 'true', enableAutoOutboundTracking: optionsEnableAutoOutboundTracking === 'true' }, (_a = context.$config) === null || _a === void 0 ? void 0 : _a.plausible);
+    if (options.domain !== null) {
+        const plausible = (0, plausible_tracker_1.default)(options);
+        if (options.enableAutoPageviews === true) {
+            plausible.enableAutoPageviews();
+        }
+        if (options.enableAutoOutboundTracking === true) {
+            plausible.enableAutoOutboundTracking();
+        }
+        inject('plausible', plausible);
+    }
+};
+exports.default = PlausiblePlugin;

lib/cjs/vue-3-plugin.js

@@ -0,0 +1,18 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const plausible_tracker_1 = __importDefault(require("plausible-tracker"));
+const Vue3Plausible = (Vue, options) => {
+    const plausible = (0, plausible_tracker_1.default)(options);
+    if ((options === null || options === void 0 ? void 0 : options.enableAutoPageviews) === true) {
+        plausible.enableAutoPageviews();
+    }
+    if ((options === null || options === void 0 ? void 0 : options.enableAutoOutboundTracking) === true) {
+        plausible.enableAutoOutboundTracking();
+    }
+    //@ts-ignore This throws error because we're still using Vue 2.x typings. But it runs fine.
+    Vue.config.globalProperties.$plausible = plausible;
+};
+exports.default = Vue3Plausible;

lib/cjs/vue-plugin.js

@@ -0,0 +1,18 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const plausible_tracker_1 = __importDefault(require("plausible-tracker"));
+const VuePlausible = (Vue, options) => {
+    const plausible = (0, plausible_tracker_1.default)(options);
+    if ((options === null || options === void 0 ? void 0 : options.enableAutoPageviews) === true) {
+        plausible.enableAutoPageviews();
+    }
+    if ((options === null || options === void 0 ? void 0 : options.enableAutoOutboundTracking) === true) {
+        plausible.enableAutoOutboundTracking();
+    }
+    Vue.$plausible = plausible;
+    Vue.prototype.$plausible = plausible;
+};
+exports.default = VuePlausible;

lib/esm/extend.js

@@ -0,0 +1 @@
+export {};

lib/esm/index.js

@@ -0,0 +1,4 @@
+import './extend';
+export { default as VuePlausible } from './vue-plugin';
+export { default as Vue3Plausible } from './vue-3-plugin';
+export { default } from './nuxt-module';

lib/esm/module-options.js

@@ -0,0 +1 @@
+export {};

lib/esm/nuxt-module.js

@@ -0,0 +1,24 @@
+import path from 'path';
+// default options, fallback to plausible-tracker defaults
+const defaultOptions = {
+    domain: undefined,
+    hashMode: undefined,
+    trackLocalhost: undefined,
+    apiHost: undefined,
+    enableAutoPageviews: true,
+    enableAutoOutboundTracking: false
+};
+const PlausibleModule = function (moduleOptions) {
+    if (!this)
+        return;
+    const options = Object.assign(Object.assign(Object.assign({}, defaultOptions), this.options.plausible), moduleOptions);
+    this.addPlugin({
+        src: path.resolve(__dirname, '../esm/nuxt-plugin.js'),
+        mode: 'client',
+        ssr: false,
+        fileName: 'vue-plausible.client.js',
+        options
+    });
+};
+export default PlausibleModule;
+export const meta = require('../../package.json');

lib/esm/nuxt-plugin.js

@@ -0,0 +1,22 @@
+import Plausible from 'plausible-tracker';
+const PlausiblePlugin = (context, inject) => {
+    var _a;
+    const optionsDomain = '<%= options.domain %>';
+    const optionsHashMode = '<%= options.hashMode %>';
+    const optionsTrackLocalhost = '<%= options.trackLocalhost %>';
+    const optionsApiHost = '<%= options.apiHost %>';
+    const optionsEnableAutoPageviews = '<%= options.enableAutoPageviews %>';
+    const optionsEnableAutoOutboundTracking = '<%= options.enableAutoOutboundTracking %>';
+    const options = Object.assign({ domain: optionsDomain.length ? optionsDomain : null, hashMode: optionsHashMode === 'true', trackLocalhost: optionsTrackLocalhost === 'true', apiHost: optionsApiHost.length ? optionsApiHost : 'https://plausible.io', enableAutoPageviews: optionsEnableAutoPageviews === 'true', enableAutoOutboundTracking: optionsEnableAutoOutboundTracking === 'true' }, (_a = context.$config) === null || _a === void 0 ? void 0 : _a.plausible);
+    if (options.domain !== null) {
+        const plausible = Plausible(options);
+        if (options.enableAutoPageviews === true) {
+            plausible.enableAutoPageviews();
+        }
+        if (options.enableAutoOutboundTracking === true) {
+            plausible.enableAutoOutboundTracking();
+        }
+        inject('plausible', plausible);
+    }
+};
+export default PlausiblePlugin;

lib/esm/vue-3-plugin.js

@@ -0,0 +1,13 @@
+import Plausible from 'plausible-tracker';
+const Vue3Plausible = (Vue, options) => {
+    const plausible = Plausible(options);
+    if ((options === null || options === void 0 ? void 0 : options.enableAutoPageviews) === true) {
+        plausible.enableAutoPageviews();
+    }
+    if ((options === null || options === void 0 ? void 0 : options.enableAutoOutboundTracking) === true) {
+        plausible.enableAutoOutboundTracking();
+    }
+    //@ts-ignore This throws error because we're still using Vue 2.x typings. But it runs fine.
+    Vue.config.globalProperties.$plausible = plausible;
+};
+export default Vue3Plausible;

lib/esm/vue-plugin.js

@@ -0,0 +1,13 @@
+import Plausible from 'plausible-tracker';
+const VuePlausible = (Vue, options) => {
+    const plausible = Plausible(options);
+    if ((options === null || options === void 0 ? void 0 : options.enableAutoPageviews) === true) {
+        plausible.enableAutoPageviews();
+    }
+    if ((options === null || options === void 0 ? void 0 : options.enableAutoOutboundTracking) === true) {
+        plausible.enableAutoOutboundTracking();
+    }
+    Vue.$plausible = plausible;
+    Vue.prototype.$plausible = plausible;
+};
+export default VuePlausible;

lib/types/extend.d.ts

@@ -0,0 +1,29 @@
+import Plausible from 'plausible-tracker';
+import { PlausibleModuleOptions } from './module-options';
+declare module 'vue/types/vue' {
+    interface Vue {
+        $plausible: ReturnType<typeof Plausible>;
+    }
+}
+declare module '@nuxt/types' {
+    interface NuxtOptions {
+        plausible?: PlausibleModuleOptions;
+    }
+    interface NuxtAppOptions {
+        readonly $plausible: ReturnType<typeof Plausible>;
+    }
+    interface Context {
+        readonly $plausible: ReturnType<typeof Plausible>;
+    }
+}
+declare module '@nuxt/types/config/runtime' {
+    interface NuxtRuntimeConfig {
+        plausible?: PlausibleModuleOptions;
+    }
+}
+declare module 'vuex/types/index' {
+    interface Store<S> {
+        readonly $plausible: ReturnType<typeof Plausible>;
+    }
+}
+//# sourceMappingURL=extend.d.ts.map

lib/types/index.d.ts

@@ -0,0 +1,6 @@
+import './extend';
+export { PlausibleModuleOptions } from './module-options';
+export { default as VuePlausible } from './vue-plugin';
+export { default as Vue3Plausible } from './vue-3-plugin';
+export { default } from './nuxt-module';
+//# sourceMappingURL=index.d.ts.map

lib/types/module-options.d.ts

@@ -0,0 +1,12 @@
+import { PlausibleInitOptions } from 'plausible-tracker/build/module/lib/tracker';
+export declare type PlausibleModuleOptions = PlausibleInitOptions & {
+    /**
+     * If true, pageviews of SPAs that use JS-based routing will be automatically tracked.
+     */
+    readonly enableAutoPageviews?: boolean;
+    /**
+     * If true, outbound link clicks will be automatically tracked.
+     */
+    readonly enableAutoOutboundTracking?: boolean;
+};
+//# sourceMappingURL=module-options.d.ts.map

lib/types/nuxt-module.d.ts

@@ -0,0 +1,6 @@
+import { Module } from '@nuxt/types';
+import { PlausibleModuleOptions } from './module-options';
+declare const PlausibleModule: Module<PlausibleModuleOptions>;
+export default PlausibleModule;
+export declare const meta: any;
+//# sourceMappingURL=nuxt-module.d.ts.map

lib/types/nuxt-plugin.d.ts

@@ -0,0 +1,4 @@
+import { Plugin } from '@nuxt/types';
+declare const PlausiblePlugin: Plugin;
+export default PlausiblePlugin;
+//# sourceMappingURL=nuxt-plugin.d.ts.map

lib/types/vue-3-plugin.d.ts

@@ -0,0 +1,19 @@
+import { PluginFunction } from 'vue';
+import Plausible from 'plausible-tracker';
+import { PlausibleModuleOptions } from './module-options';
+declare module 'vue/types/vue' {
+    interface VueConstructor {
+        $plausible: ReturnType<typeof Plausible>;
+    }
+    interface Vue {
+        $plausible: ReturnType<typeof Plausible>;
+    }
+}
+declare module '@vue/runtime-core' {
+    interface ComponentCustomProperties {
+        $plausible: ReturnType<typeof Plausible>;
+    }
+}
+declare const Vue3Plausible: PluginFunction<PlausibleModuleOptions>;
+export default Vue3Plausible;
+//# sourceMappingURL=vue-3-plugin.d.ts.map

lib/types/vue-plugin.d.ts

@@ -0,0 +1,14 @@
+import { PluginFunction } from 'vue';
+import Plausible from 'plausible-tracker';
+import { PlausibleModuleOptions } from './module-options';
+declare module 'vue/types/vue' {
+    interface VueConstructor {
+        $plausible: ReturnType<typeof Plausible>;
+    }
+    interface Vue {
+        $plausible: ReturnType<typeof Plausible>;
+    }
+}
+declare const VuePlausible: PluginFunction<PlausibleModuleOptions>;
+export default VuePlausible;
+//# sourceMappingURL=vue-plugin.d.ts.map