活性分析跟踪器
重写 可信跟踪器 并铭记可扩展性和未来的特点.
[大 这不是一个临时替代.
为什么重写?
来自柏拉图克球队的原追踪员在两年多的时间里没有收到更新.
从那时起 脚本跟踪器 npm 软件包已经进化,但是没有。 例如,不支持文件倒闭和收入跟踪.
此外,一些严重的问题被打开,没有得到解决。 外出追踪是打破 target="_blank" 例如,属性.
使用量
首先,安装软件包:
npm install @barbapapazes/plausible-tracker
那么,用你的代码:
import { createPlausibleTracker } from '@barbapapazes/plausible-tracker'
const plausible = createPlausibleTracker()
plausible.trackPageview() // Track a page view
plausible.trackEvent('signup') // Track a custom event
[注] 这个
trackPageview是一个包裹周围trackEvent与pageview事件名称.
第一项论据是: trackPageview 和第二个 trackEvent 是一个接受道具、数据和在事件发送后触发的回调对象.
道具与提供 正式可打印脚本。 。 。 .
数据允许您覆盖一些值,如 url, (中文(简体) ), referrer 财务报告和审定财务报表 deviceWidth。 。 。 .
plausible.trackEvent('signup', { props: { variation: 'button A' }, callback: () => console.log('sended') }) // Track a custom event with a custom prop with a callback
此核心跟踪器是最小的, 不包括任何扩展 。 这样你就可以轻松地编出它来避免运送你不需要的代码.
扩展
扩展是核心跟踪器中没有包含的特性.
[注] 扩展会有助于将软件包与正式脚本保持最新.
当前扩展 :
自动页面查看跟踪
import { createPlausibleTracker } from '@barbapapazes/plausible-tracker'
import { useAutoPageviews } from '@barbapapazes/plausible-tracker/extensions'
const plausible = createPlausibleTracker()
const { install, cleanup, setEventOptions } = useAutoPageviews(plausible)
install()
// At any time, you can stop the auto pageview tracking
cleanup()
// You can also set the page options
setEventOptions({ props: { variation: 'button A' } })
// Now, every page view will include the prop `variation: 'button A'`
输出链接点击跟踪
import { createPlausibleTracker } from '@barbapapazes/plausible-tracker'
import { useAutoOutboundTracking } from '@barbapapazes/plausible-tracker/extensions'
const plausible = createPlausibleTracker()
const { install, cleanup, setEventOptions } = useOutboundLinkTracking(plausible)
install()
// At any time, you can stop the outbound link tracking
cleanup()
// You can also set the page options
setEventOptions({ props: { variation: 'button A' } })
文件下载跟踪
import { createPlausibleTracker } from '@barbapapazes/plausible-tracker'
import { useAutoFileDownloadsTracking } from '@barbapapazes/plausible-tracker/extensions'
const plausible = createPlausibleTracker()
const { install, cleanup, setEventOptions } = useFileDownloadsTracking(plausible, { fileTypes: [] }) // You can pass the file types to track. For example: ['pdf', 'zip']
install()
// At any time, you can stop the file downloads tracking
cleanup()
// You can also set the page options
setEventOptions({ props: { variation: 'button A' } })
[大 默认情况下,文件下载不会跟踪任何文件类型. 您需要通过文件类型来跟踪 .
软件包导出 defaultFileTypes 是最常用文件类型的数组 和正式剧本一样。 。 。 .
import { defaultFileTypes } from '@barbapapazes/plausible-tracker/extensions'
const { install, cleanup, setEventOptions } = useFileDownloadsTracking(plausible, { fileTypes: defaultFileTypes })
这使得您可以轻松自定义文件类型以跟踪 :
import { defaultFileTypes } from '@barbapapazes/plausible-tracker/extensions'
const { install, cleanup, setEventOptions } = useFileDownloadsTracking(plausible, { fileTypes: [...defaultFileTypes, 'svg'] })
贡献
捐款非常受欢迎。 我不是柏拉图球队的一员, 我在空闲时间这样做
- 叉子存储器
- 安装依赖性 :
pnpm install - 构建工程 :
pnpm build - 使用游乐场测试您的更改 :
cd playground && pnpm dev
谢谢你的帮助!