diff --git a/env.d.ts b/env.d.ts index 25a0ba96..53d05202 100644 --- a/env.d.ts +++ b/env.d.ts @@ -2,6 +2,8 @@ /// interface ImportMetaEnv { + VITE_PLAUSIBLE_API_HOST: string; + VITE_PLAUSIBLE_DOMAIN: string; PACKAGE_VERSION: string; PROD: boolean; } diff --git a/package-lock.json b/package-lock.json index 67a1c999..7d597d76 100644 --- a/package-lock.json +++ b/package-lock.json @@ -22,6 +22,7 @@ "lodash": "^4.17.21", "naive-ui": "^2.28.0", "pinia": "^2.0.11", + "plausible-tracker": "^0.3.5", "qrcode": "^1.5.0", "randombytes": "^2.1.0", "uuid": "^8.3.2", @@ -8187,6 +8188,14 @@ } } }, + "node_modules/plausible-tracker": { + "version": "0.3.5", + "resolved": "https://registry.npmjs.org/plausible-tracker/-/plausible-tracker-0.3.5.tgz", + "integrity": "sha512-6c6VPdPtI9KmIsfr8zLBViIDMt369eeaNA1J8JrAmAtrpSkeJWvjwcJ+cLn7gVJn5AtQWC8NgSEee2d/5RNytA==", + "engines": { + "node": ">=10" + } + }, "node_modules/pngjs": { "version": "5.0.0", "resolved": "https://registry.npmjs.org/pngjs/-/pngjs-5.0.0.tgz", @@ -16898,6 +16907,11 @@ } } }, + "plausible-tracker": { + "version": "0.3.5", + "resolved": "https://registry.npmjs.org/plausible-tracker/-/plausible-tracker-0.3.5.tgz", + "integrity": "sha512-6c6VPdPtI9KmIsfr8zLBViIDMt369eeaNA1J8JrAmAtrpSkeJWvjwcJ+cLn7gVJn5AtQWC8NgSEee2d/5RNytA==" + }, "pngjs": { "version": "5.0.0", "resolved": "https://registry.npmjs.org/pngjs/-/pngjs-5.0.0.tgz", diff --git a/package.json b/package.json index cf65d8db..b5c29c08 100644 --- a/package.json +++ b/package.json @@ -28,6 +28,7 @@ "lodash": "^4.17.21", "naive-ui": "^2.28.0", "pinia": "^2.0.11", + "plausible-tracker": "^0.3.5", "qrcode": "^1.5.0", "randombytes": "^2.1.0", "uuid": "^8.3.2", diff --git a/src/main.ts b/src/main.ts index 8de1ca50..fe0b02ff 100644 --- a/src/main.ts +++ b/src/main.ts @@ -2,6 +2,7 @@ import { createApp } from 'vue'; import { createPinia } from 'pinia'; import { createHead } from '@vueuse/head'; import { registerSW } from 'virtual:pwa-register'; +import { plausible } from './plugins/plausible.plugin'; registerSW(); @@ -16,5 +17,6 @@ app.use(createPinia()); app.use(createHead()); app.use(router); app.use(naive); +app.use(plausible); app.mount('#app'); diff --git a/src/plugins/plausible.plugin.ts b/src/plugins/plausible.plugin.ts new file mode 100644 index 00000000..7acfe024 --- /dev/null +++ b/src/plugins/plausible.plugin.ts @@ -0,0 +1,17 @@ +import Plausible, { type PlausibleOptions } from 'plausible-tracker'; +import type { App } from 'vue'; + +const options: PlausibleOptions = { + domain: import.meta.env.VITE_PLAUSIBLE_DOMAIN , + apiHost: import.meta.env.VITE_PLAUSIBLE_API_HOST, + trackLocalhost: false, +}; + +export const plausible = { + install: (app: App) => { + const plausible = Plausible(options); + plausible.enableAutoPageviews(); + + app.config.globalProperties.$plausible = plausible; + }, +};