Plausible Nuxt 3 Module
@huntersofbook/plausible-nuxt
This module huntersofbook team created.
Features
- Zero-config required
- Auto-import composables usePlausible()
Setup
pnpm add @huntersofbook/plausible-nuxt
yarn add @huntersofbook/plausible-nuxt
pnpm add @huntersofbook/plausible-nuxt
Nuxt Config
export default defineNuxtConfig({
modules: [
'@huntersofbook/plausible-nuxt'
],
plausible: {
init: {
domain: 'localhost',
apiHost: 'https://site.com',
trackLocalhost: true
},
// If this is loaded you can make it true, https://github.com/nuxt-modules/partytown
partytown: false,
}
})
Composables
<script setup lang="ts">
const { trackEvent } = usePlausible()
</script>
<template>
<div>
<button @click="trackEvent('nuxt')">
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:
Option | Type | Description | Default |
---|---|---|---|
domain | string |
Your site's domain, as declared by you in Plausible's settings | location.hostname |
hashMode | bool |
Enables tracking based on URL hash changes. | false |
trackLocalhost | bool |
Enables tracking on localhost. | false |
apiHost | string |
Plausible's API host to use. Change this if you are self-hosting. | 'https://plausible.io' |
Settings Default
Option | Type | Description | Default |
---|---|---|---|
enableAutoPageviews | bool |
Your site's domain, as declared by you in Plausible's settings | true |
enableAutoOutboundTracking | bool |
Enables tracking based on URL hash changes. | false |
💻 Development
- Clone this repository
- Enable Corepack using
corepack enable
(usenpm 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