huntersofbook

HDateTime

Setup

Setup

pnpm
pnpm add @huntersofbook/plausible
yarn
yarn add @huntersofbook/plausible
npm
npm add @huntersofbook/plausible

Vue Config

main.ts
import { createPlausible } from '@huntersofbook/plausible-vue'const plausible = createPlausible({  init: {    domain: 'domain.com',    apiHost: 'https://host.com',    trackLocalhost: true,  },  settings: {    enableAutoOutboundTracking: true,    enableAutoPageviews: true,  },})app.use(plausible)

Composables

<script setup lang="ts">const { trackEvent } = usePlausible()</script><template>  <div>    <button @click="trackEvent('vue')">      click me    </button>  </div></template>
<script setup lang="ts">const { trackPageview } = usePlausible()</script>

Init Default

Plausible() accepts some options that you may want to provide:

OptionTypeDescriptionDefault
domainstringYour site's domain, as declared by you in Plausible's settingslocation.hostname
hashModeboolEnables tracking based on URL hash changes.false
trackLocalhostboolEnables tracking on localhost.false
apiHoststringPlausible's API host to use. Change this if you are self-hosting.'https://plausible.io'

Settings Default

OptionTypeDescriptionDefault
enableAutoPageviewsboolYour site's domain, as declared by you in Plausible's settingstrue
enableAutoOutboundTrackingboolEnables tracking based on URL hash changes.false

Development 💻

  • Clone this repository
  • Enable Corepack using corepack enable (use npm i -g corepack for Node.js < 16.10)
  • Install dependencies using pnpm install
  • Stub module with pnpm dev:prepare
  • Run pnpm dev to start playground in development mode

License

MIT License © 2022-PRESENT productdevbook

Credits 💚

Nuxt 3 Plugin danielroe

sponsor us

Edit this page on GitHub

Huntersofbook Ui

Plausible

Vue Packages

Plausible